微信小程序开发(1)---配置
来源:互联网 发布:男朋友活好体验 知乎 编辑:程序博客网 时间:2024/06/10 16:26
我们使用app.json文件来对微信小程序进行全局配置,决定页面文件的路径、窗口表现、设置网络超时时间、设置多 tab 等。
以下是一个包含了所有配置选项的简单配置app.json :{
"pages": [
"pages/index/index",
"pages/logs/index"
],
"window": {
"navigationBarTitleText": "Demo"
},
"tabBar": {
"list": [{
"pagePath": "pages/index/index",
"text": "首页"
}, {
"pagePath": "pages/logs/logs",
"text": "日志"
}]
},
"networkTimeout": {
"request": 10000,
"downloadFile": 10000
},
"debug": true
}
app.json 配置项列表
pages
接受一个数组,每一项都是字符串,来指定小程序由哪些页面组成。每一项代表对应页面的【路径+文件名】信息,数组的第一项代表小程序的初始页面。小程序中新增/减少页面,都需要对 pages 数组进行修改。
文件名不需要写文件后缀,因为框架会自动去寻找路径.json,.js,.wxml,.wxss的四个文件进行整合。
如开发目录为:
pages/
pages/index/index.wxml
pages/index/index.js
pages/index/index.wxss
pages/logs/logs.wxml
pages/logs/logs.js
app.js
app.json
app.wxss
则,我们需要在 app.json 中写
{
"pages":[
"pages/index/index"
"pages/logs/logs"
]
}
window
用于设置小程序的状态栏、导航条、标题、窗口背景色。
注:HexColor(十六进制颜色值),如"#ff00ff"
{
"window":{
"navigationBarBackgroundColor": "#ffffff",
"navigationBarTextStyle": "black",
"navigationBarTitleText": "微信接口功能演示",
"backgroundColor": "#eeeeee",
"backgroundTextStyle": "light"
}
}
tabBar
如果我们的小程序是一个多 tab 应用(客户端窗口的底部有tab栏可以切换页面),那么我们可以通过 tabBar 配置项指定 tab 栏的表现,以及 tab 切换时显示的对应页面。
Tip:
1. 当设置 position 为 top 时,将不会显示 icon
2. tabBar 是一个数组,只能配置最少2个、最多5个 tab,tab 按数组的顺序排序。
属性说明:
其中 list 接受一个数组,数组中的每个项都是一个对象,其属性值如下:
networkTimeout
可以设置各种网络请求的超时时间。
属性说明:
debug
可以在开发者工具中开启 debug 模式,在开发者工具的控制台面板,调试信息以 info 的形式给出,其信息有Page的注册,页面路由,数据更新,事件触发 。可以帮助开发者快速定位一些常见的问题。
阅读全文
0 0
- 微信小程序开发(1)---配置
- 微信小程序开发-配置
- 微信小程序开发详解(六)---微信小程序配置
- (一)微信小程序开发配置
- WebStorm配置微信小程序开发
- 开发配置基础设置-小程序开发设置1-微信小程序开发-视频教程8
- 微信小程序开发—(一)全局配置
- 微信小程序 开发工具及开发环境配置
- 微信小程序开发1
- 微信小程序开发 ---- 1
- 配置实现快速程序开发
- 微信小程序开发教程(1:初识)
- 微信小程序开发教程(1)
- 微信小程序开发记录(1)
- 微信小程序开发实践经验总结(1)
- (原创干货)微信小程序开发以及配置阿里云服务器
- 开发微信小程序(3)-全局配置app.json及底部导航栏实现
- natapp 配置微信小程序开发需要的网络环境
- poj 3692(浅谈二分图最大匹配求最大独立集在解决最大团问题中的应用)
- go get -insecure 修改URL(uses insecure protocol)
- RxJava(RxAndroid)基本使用入门
- Mysql-常用命令
- 单链表排序(冒泡法)
- 微信小程序开发(1)---配置
- javaDBUtils和连接池(连接池)
- BI EE 安装补丁
- GDI+图像去污——四周去污
- 【27】你以为border-radius只是圆角吗【各种角度】
- Android可伸缩布局-FlexboxLayout(支持RecyclerView集成)
- 3:十进制数转二进制数(类似大整数除法)
- 整理面试相关
- 计算字符串的相似度-两种解法