app.json是微信小程序的全局配置文件,用于配置小程序的全局属性,包括页面路径、窗口样式、网络超时时间、底部导航栏等等。下面是app.json的常用配置项:
pages
此处配置小程序的页面路径,以数组形式展示,数组长度最大为10,第一个元素为小程序的首页
"pages": [
"pages/index/index",
"pages/note/add",
"pages/me/me",
"pages/login/login",
"pages/note/detail",
"pages/note/myNote"
],
window
此处配置小程序的窗口样式,包括导航栏、背景色、标题、颜色等等。
- 设置页面标题:
{
"navigationBarTitleText": "页面标题"
}
- 自定义导航栏背景颜色,文字颜色和图标:
{
"navigationBarBackgroundColor": "#ffffff",
"navigationBarTextStyle": "black",
"navigationBarTitleImage": "path/to/image"
}
- 隐藏返回按钮,或设置返回按钮的颜色:
{
"navigationBarBackgroungColor": "#ffffff",
"navigationBarTextStyle": "black",
"navigationBarTitleImage": "path/to/image",
"navigationBarBackButtonImage": "path/to/image"
}
- 隐藏导航栏:
{
"navigationBarHidden": true
}
- 设置下拉刷新样式:
{
"backgroundTextStyle": "dark",
"backgroundColor": "#ffffff",
"enablePullDownRefresh": true,
"onReachBottomDistance": 50
}
tabBar
此处配置小程序的底部导航栏,包括路径、样式、文字等等。
"tabBar": {
"color": "#654",
"selectedColor": "#3963bc",
"list": [
{
"pagePath": "pages/index/index",
"text": "首页",
"iconPath": "/images/home.png",
"selectedIconPath": "/images/homeOn.png"
},
{
"pagePath": "pages/note/add",
"text": "发布",
"iconPath": "/images/add.png",
"selectedIconPath": "/images/addOn.png"
},
{
"pagePath": "pages/me/me",
"text": "我的",
"iconPath": "/images/me.png",
"selectedIconPath": "/images/meOn.png"
}
]
},
usingComponents
小程序开发中用于引入自定义组件的配置项
{
"usingComponents": {
"l-avatar": "/miniprogram_npm/lin-ui/avatar/index",
"l-slide-view": "/miniprogram_npm/lin-ui/slide-view/index",
"l-list": "/miniprogram_npm/lin-ui/list/index",
"l-input": "/miniprogram_npm/lin-ui/input/index",
"l-button": "/miniprogram_npm/lin-ui/button/index",
"l-toast": "/miniprogram_npm/lin-ui/toast/index",
"l-textarea": "/miniprogram_npm/lin-ui/textarea/index"
}
}
其中,l-list 是自定义组件的名称,/miniprogram_npm/lin-ui/list/index 表示组件的路径。
在wxml文件中使用组件,例如:
<l-list></l-list>
networkTimeout
此处配置小程序的网络请求超时时间,单位为毫秒
"networkTimeout": {
"request": 10000, // 超时时间,单位为毫秒
"downloadFile": 10000, // 下载文件超时时间,单位为毫秒
"uploadFile": 10000 // 上传文件超时时间,单位为毫秒
}
debug
此处配置小程序的调试模式,若为true,则开启调试模式。
"debug": true
以上是app.json的常用配置项,小程序开发者可以根据自己的需求进行相应的配置。