Introduction to the configuration method of json configuration in WeChat applet (with code)

This article brings you an introduction to the configuration method of json configuration in WeChat applet (with code). It has certain reference value. Friends in need can refer to it. I hope it will be helpful to you.

json configuration can be divided into:
1. app.json
2. page.json
1. app.json
The app.json file is used to configure WeChat Mini program for global configuration

{
  **"pages"**: [
    "pages/index/index",
    "pages/logs/index"
  ],
  //调试快捷键：将鼠标点击到需要调试的页面，按住Alt同时按上键，这时，需要调试的页面就会一行一行的向上移动，直到首页
  **"window"**: {
    "navigationBarBackgroundColor":"#000000",//导航栏背景颜色
    "navigationBarTextStyle":"black",//导航栏标题颜色，仅支持white和black
    "navigationBarTitleText": "XXX",//导航栏标题文字内容
    "backgroundColor":"#ffffff",//窗口的背景色
    "backgroundTextStyle":"dark",//下拉 loading 的样式，仅支持 dark / light
    "enablePullDownRefresh":true,//是否全局开启下拉刷新,true或false
   "onReachBottomDistance":"50px";//页面上拉触底事件触发时距页面底部距离，单位为px。
  },
  **"tabBar"**: {
      "color":"",//文字默认颜色
      "selectedColor":"",//文字选中时的颜色
      "backgroundColor":"",tab的背景色
      "borderStyle":"",//tabbar上边框的颜色， 仅支持 black / white
      "position":"",//tabBar的位置，仅支持 bottom / top
    "list": [
    //最少2个、最多5个 tab
    {
      "pagePath": "pages/index/index",
      "text": "首页",
      "iconPath":"XXXX",
      "selectedIconPath":"XXX"
    }, {
      "pagePath": "pages/logs/logs",
      "text": "日志"
      "iconPath":"XXXX",
      "selectedIconPath":"XXX"
    }]
  },
  //其中 list 接受一个数组，只能配置最少2个、最多5个 tab。tab 按数组的顺序排序，每个项都是一个对象
  **"networkTimeout"**: {
    "request": 60000,//单位毫秒,默认60000
    "uploadFile":60000,//单位毫秒,默认60000
    "downloadFile": 60000//单位毫秒,默认60000
  }
}

2. page.json

{
  "navigationBarBackgroundColor": "#ffffff",//导航栏背景颜色
  "navigationBarTextStyle": "black",//导航栏标题颜色，仅支持 black / white
  "navigationBarTitleText": "微信接口功能演示",//导航栏标题文字内容
  "backgroundColor": "#eeeeee",//窗口的背景色
  "backgroundTextStyle": "light",//下拉 loading 的样式，仅支持 dark / light
  "enablePullDownRefresh":true,//是否全局开启下拉刷新
  "onReachBottomDistance":"50px",//页面上拉触底事件触发时距页面底部距离，单位为px。
  "disableScroll":false//设置为 true 则页面整体不能上下滚动；只在页面配置中有效，无法在 app.json 中设置该项
}

Related recommendations:

WeChat mini program example code: pull up and load more implementation methods

Instance analysis of data binding in WeChat applet (code)

The above is the detailed content of Introduction to the configuration method of json configuration in WeChat applet (with code). For more information, please follow other related articles on the PHP Chinese website!