浅谈小程序的全局配置
小程序根目录下的app.json文件可用来对微信小程序做全局配置,如:决定页面文件路径、窗口表现、设置tab、设置超时时间等。
一、pages
构成小程序的页面,每一项都对应一个页面的路径,文件名不需要加后缀,小程序会自动去寻找相对应位置的文件进行处理。
数组的第一项代表小程序的初始页面,新增/删除都要对pages数组进行修改。
"pages": [
"pages/home/home",
"pages/cart/cart",
"pages/my/my",
"pages/detail/detail",
],
如果需要新建页面。可在此直接配置以上格式的页面文件路径,小程序会自动生成页面文件。当然也可以手动在目录里创建页面文件夹及其页面文件,但是需要在pages里配置页面路径。
二、window
配置小程序的状态栏、导航条、标题、窗口背景色等。
"window": {
"backgroundTextStyle": "light", //下拉loading的样式,仅支持dark / light
"navigationBarBackgroundColor": "#f66", //导航栏背景颜色
"navigationBarTitleText": "嘿嘿", //导航栏标题文字内容
"navigationBarTextStyle": "white", //导航栏标题颜色,仅支持 black / white
"enablePullDownRefresh":true, //是否开启全局的下拉刷新。默认为false
"backgroundColorTop":"#f66666", //顶部窗口的背景色,仅 iOS 支持
"onReachBottomDistance":50 //页面上拉触底事件触发时距页面底部距离,单位为 px。
},
更多请参考微信小程序开发者文档
三、tabBar
用于配置指定tab栏的表现以及tab切换时显示的对应页面。tabBar,里面有一个list的列表,它是一个数组,里面的每个对象就是一个tab标签,最少要有2个tab。
"tabBar":{
"color":"#333", //tab上的文字默认颜色,仅支持十六进制颜色
"selectedColor":"#f66", //tab 上的文字选中时的颜色,仅支持十六进制颜色
"backgroundColor":"white", //tab 的背景色,仅支持十六进制颜色
"position":"top" //tabBar 的位置仅支持 bottom/top
"list":[ //接受一个数组,可配置最少2个、最多5个tab。tab按数组的顺序排序,每个项都是一个对象
{
"pagePath":"pages/home/home", //页面路径,必须先在pages中定义
"text":"首页", //tab上按钮文字
"iconPath": "assgin/img/home.png", //未选中时的图片路径,icon大小限制为40kb,建议尺寸为 81px * 81px,不支持网络图片。
"selectedIconPath": "assgin/img/home_select.png" //选中时的图片路径,条件和上一条一样
**//注意:当position为 top 时,不显示 icon。**
},{
"pagePath": "pages/kind/kind",
"text": "分类",
"iconPath":"assgin/img/kind.png",
"selectedIconPath":"assgin/img/kind_selec.png" //
},
{
"pagePath": "pages/cart/cart",
"text": "购物车",
"iconPath": "assgin/img/cart.png",
"selectedIconPath": "assgin/img/cart_selec.png"
},
{
"pagePath": "pages/my/my",
"text": "个人中心",
"iconPath": "assgin/img/my.png",
"selectedIconPath": "assgin/img/my_selec.png"
}
]
},
四、networkTimeout
各类网络请求的超时时间,单位均为毫秒。( 默认为60000 )
"networkTimeout": {
"request": 30000, // wx.request 的超时时间
"connectSocket": 30000, // wx.connectSocket 的超时时间
"uploadFile": 30000, // wx.uploadFile 的超时时间
"downloadFile ": 30000 // wx.downloadFile 的超时时间
},
五、permission
小程序接口权限相关设置。字段类型为 Object。
"permission":{
"scope.userLocation":{ //位置相关权限声明
"desc":"你的位置信息将用于小程序位置接口的效果展示" //小程序获取权限时展示的接口用途说明。最长 30 个字符
}
},
六、requiredBackgroundModes
申明需要后台运行的能力,类型为数组。目前仅支持:
audio
:后台音乐播放
location
:后台定位
例:
{
"pages": ["pages/index/index"],
"requiredBackgroundModes": ["audio", "location"]
}
以上就是大多常用的全局配置,疫情当中,停工不停学,在逆战中成长,如果还想了解更多更详细,戳这里进入微信小程序官方文档~~