微信小程序——全局以及页面的配置

ゝ一世哀愁。 2024-04-24 14:43 7阅读 0赞

## 前言 ##

相信大家在做小程序开发的时候一定遇到过一些配置问题吧，配置问题是一个项目开始的基本，所以今天带大家看看全局和单个页面的配置吧~

## 全局配置 ##

小程序根目录下的 `app.json` 文件用来对微信小程序进行全局配置，决定页面文件的路径、窗口表现、设置网络超时时间、设置多 tab 等。

完整配置项说明请参考[小程序全局配置![icon-default.png?t=N7T8][icon-default.png_t_N7T8]https://developers.weixin.qq.com/miniprogram/dev/reference/configuration/app.html][icon-default.png_t_N7T8_icon-default.png_t_N7T8_https_developers.weixin.qq.com_miniprogram_dev_reference_configuration_app.html]

以下是一个包含了部分常用配置选项的 `app.json` ：

{
      "pages": [
        "pages/index/index",
        "pages/logs/index"
      ],
      "window": {
        "navigationBarTitleText": "Demo"
      },
      "tabBar": {
        "list": [{
          "pagePath": "pages/index/index",
          "text": "首页"
        }, {
          "pagePath": "pages/logs/index",
          "text": "日志"
        }]
      },
      "networkTimeout": {
        "request": 10000,
        "downloadFile": 10000
      },
      "debug": true
    }

## 页面配置 ##

每一个小程序页面也可以使用同名 `.json` 文件来对本页面的窗口表现进行配置，页面中配置项会覆盖 `app.json` 的 `window` 中相同的配置项。

完整配置项说明请参考

[小程序配置 / 页面配置 (qq.com)![icon-default.png?t=N7T8][icon-default.png_t_N7T8]https://developers.weixin.qq.com/miniprogram/dev/reference/configuration/page.html][_ _ _qq.com_icon-default.png_t_N7T8_icon-default.png_t_N7T8_https_developers.weixin.qq.com_miniprogram_dev_reference_configuration_page.html]

例如：

{
      "navigationBarBackgroundColor": "#ffffff",
      "navigationBarTextStyle": "black",
      "navigationBarTitleText": "微信接口功能演示",
      "backgroundColor": "#eeeeee",
      "backgroundTextStyle": "light"
    }

## 总结 ##

以上就是一个关于全局配置的介绍了，但是更多详细的内容可以前往官方文档查看，官方文档更加全面哦~期待和各位一起进步呀![013d39e548d2491fb191c38f738e72dd.jpeg][]

[icon-default.png_t_N7T8]: https://csdnimg.cn/release/blog_editor_html/release2.3.6/ckeditor/plugins/CsdnLink/icons/icon-default.png?t=N7T8
[icon-default.png_t_N7T8_icon-default.png_t_N7T8_https_developers.weixin.qq.com_miniprogram_dev_reference_configuration_app.html]: https://developers.weixin.qq.com/miniprogram/dev/reference/configuration/app.html
[_ _ _qq.com_icon-default.png_t_N7T8_icon-default.png_t_N7T8_https_developers.weixin.qq.com_miniprogram_dev_reference_configuration_page.html]: https://developers.weixin.qq.com/miniprogram/dev/reference/configuration/page.html
[013d39e548d2491fb191c38f738e72dd.jpeg]: https://image.dandelioncloud.cn/pgy_files/images/2024/04/24/afb9b45d02644ce69353cc0c47574877.jpeg