微信小程序开发教程(六)配置——app.json、page.json详解
全局配置:app.json
微信小程序的全局配置保存在app.json文件中。开发者通过使用app.json来配置页面文件(pages)的路径、窗口(window)表现、设定网络超时时间值(networkTimeout)以及配置多个切换页(tarBar)等。
首先看一个典型的全局配置app.json文件

{
"pages": [
"pages/index/index",
"pages/logs/logs",
"pages/demo/demo"
],
"window": {
"backgroundTextStyle": "light",
"navigationBarBackgroundColor": "#fff",
"navigationBarTitleText": "WeChat",
"navigationBarTextStyle": "black"
},
"tarBar": {
"list": [{
"pagePath":"pages/index/index",
"text": "首页"
},{
"pagePath": "pages/logs/logs",
"text": "日志"
},{
"pagePath": "pages/demo/demo",
"text": "demo"
}]
},
"networkTimeout": {
"request": 20000,
"connectSocket": 20000,
"uploadFile": 20000,
"downloadFile": 20000
},
"debug":true
}

全局配置项及描述如下表:

1.pages配置项
接受一个数组,每一项都是字符串,来指定小程序由哪些页面组成。每一项代表对应页面的【路径+文件名】信息。
pages配置项要注意三点:
1)数组的第一项用于设定小程序的初始页面。
2)小程序中新增/减少页面,都需要对pages数组进行修改。
3)文件名不需要写文件后缀。小程序框架会自动去寻找路径.json、.js、.wxml、.wxss这四类文件进行整合。
2.window配置项
用于设置小程序的状态栏、导航条、标题、窗口等对象的颜色、背景色、内容属性,非必填配置项。没有配置时将使用默认值。window可配置的对象见下表。

注:HexColor为十六进制颜色值类型,如“#ff00ff”
3.tarBar配置项
小程序可以是多标签页切换的应用,需要通过tarBar配置项来指定标签页的表现,及标签页切换时所显示的对应页面。

tarBar配置项接受多个对象的设定,其中的对象list是一个数组,用于配置标签页。最少配置2个、最多配置5个,标签页按数组的顺序排序。当设置 position 为 top 时,将不会显示 icon。
其中list接受数组值,数组中的每一项也都是一个对象,其属性值如下:


4.networkTimeout配置项
networkTimeout配置项用于设置各种网络请求对象的超时时间,非必须配置项。可设置的网络请求超时的相关对象有request、connectSocket、uploadFile、downloadFile。超时的单位均为毫秒。这些超市若不设置,则默认使用操作系统内核或遵循服务器WebServer的设定值。

5.debug配置项
debug配置项用于开启开发者工具的调试模式,他接受一个boolean值(默认是false)。开启后,页面(page)的注册、页面路由、数据更新、事件触发等调试信息将以info的形式,输出在“调试”功能的console面板上。
注意:正式发布时应当关闭此配置项开关。
页面配置:page.json
除了全局的app.json配置外,还可以用.json文件对小程序项目中的每一个页面进行配置,但只能设置本页面的window配置项的内容,页面.json文件中的window配置值将覆盖app.json中的配置值。

微信小程序开发教程(六)配置——app.json、page.json详解的更多相关文章
- 微信小程序开发教程(七)逻辑层——.js详解
逻辑层,是事务逻辑处理的地方.对于小程序而言,逻辑层就是.js脚本文件的集合.逻辑层将数据进行处理后发送给视图层,同时接收视图层的事件反馈. 微信小程序开发框架的逻辑层是由JavaScript编写.在 ...
- 微信小程序开发教程(九)视图层——.wxss详解
WXSS是一套样式语言,用于描述WXML的组件样式. 官方文档表示,WXSS的选择器目前支持(“.class”.“#id”.“elemnt”.“element,element”.“::after”.“ ...
- 微信小程序开发教程(八)视图层——.wxml详解
框架的视图层由WXMKL(WeiXin Markup language)与WXSS(WeiXin Style Sheet)编写,由组件进行展示. 对于微信小程序而言,视图层就是所有.wxml文件与.w ...
- 【微信小程序开发】页面配置
app下的app.json文件是全局配置. app下的每一个page中,也可以配置.json文件. page中配置的内容是对应app中window配置项下的内容. page中的配置将覆盖window中 ...
- 微信小程序开发教程目录
本系列教程是自己在工作中使用到而记录的,没有顺序之分 如有错误之处,请给与指正,也不希望误导了别人 微信小程序开发教程目录 微信小程序之注册和入门 微信小程序之HTTPS请求 微信小程序开发之选项卡 ...
- 【微信小程序开发】全局配置
今天看看小程序全局配置. 上一篇[微信小程序开发]秒懂,架构及框架 配置,无非就是为了增加框架的灵活性,而定下的规则. 微信小程序的配置文件是一个树状结构,各个节点代表不同的配置项,小程序框架会解析这 ...
- 微信小程序开发系列六:微信框架API的调用
微信小程序开发系列教程 微信小程序开发系列一:微信小程序的申请和开发环境的搭建 微信小程序开发系列二:微信小程序的视图设计 微信小程序开发系列三:微信小程序的调试方法 微信小程序开发系列四:微信小程序 ...
- 微信小程序开发教程 #043 - 在小程序开发中使用 npm
本文介绍了如何在微信小程序开发中使用 npm 中包的功能,大大提高微信小程序的开发效率,同时也是微信小程序系列教程的视频版更新. 微信小程序在发布之初没有对 npm 的支持功能,这也是目前很多前端开发 ...
- 微信小程序开发教程,大多数人都搞错的八个问题
小程序目前被炒得沸沸扬扬,无数媒体和企业借机获取阅读流量. 这再次证明一点,微信想让什么火,真的就能让什么火.这种能力真是全中国再也没有人有了,政府也没有. 但四处传的消息很多是失真的,废话不说,先列 ...
- 微信小程序开发教程(五)开发框架:MINA
微信团队为小程序提供的框架命名为MINA应用框架.MINA框架通过封装微信客户端提供的文件系统.网络通信.任务管理.数据安全等基础功能,对上层提供一整套JavaScript API,让开发者能够非常方 ...
随机推荐
- 网页访问过程(基于CDN)
1. 全局负载均衡(基于DNS) 如果有多台 WEB 服务器同时为一个域名提供服务时,即一条 URL 对应多个 IP 地址,那么该 URL 的权威域名服务器可能会根据该 URL 解析出多个 IP 地址 ...
- js对数组进行浅复制,深复制的方法
js 数组常用方法,数组的拷贝(不影响原数组),数组相等 置顶2017年07月17日 17:39:26 阅读数:4640 改变原数组的方法: pop();删除尾部的第一个元素并且返回这个元素: var ...
- 爬虫学习之-requests乱码
总体功能的一个演示 import requests response = requests.get("https://www.baidu.com") print(type(resp ...
- 事件ID:7026(“下列引导或系统启动驱动程序无法加载: cdrom”)的解决方法
电脑没有安装光驱,而是使用USB光驱/虚拟光驱软件,每次开机后"事件查看器"都显示错误:"下列引导或系统启动驱动程序无法加载: cdrom"(事件ID:7 ...
- web.config文件详解[转]
一).Web.Config是以XML文件规范存储,配置文件分为以下格式1.配置节处理程序声明特点: 位于配置文件的顶部,包含在<configSections>标志中.2.特定应用程序配置特 ...
- maven下载、安装、卸载以及MyEclipse配置maven
maven下载 官网下载:http://maven.apache.org/download.cgi 点击链接为官网下载页面,翻到下图所示位置,点击红框选项即可下载 maven安装 1.解压 ...
- .net webapi创建接口
最近使用webapi做了一个用户数据库接口,方便其它网站接入验证用户,实现中解决出现的一些问题,做了一些记录, 1.返回显示为json数据 2.允许其他网站访问,刚开始没有设,在本地机测试时可以访问, ...
- bzoj2095-Bridge
题意 一个 \(n\) 个点 \(m\) 条边的图,每条边双向都有权值(可能不一样).求从 1 开始,经过所有点,经过所有边一次且仅一次(即一定要经过这条边的某个方向)回到 1 的路径上权值最大的最小 ...
- Beta 完结撒花 —— 事后诸葛亮
写在前面 林燊大哥 团队成员 短学号 名 2325 燊(队长) 1232 志豪 1131 喜源 2523 宏岩 2230 恺翔 2509 钧昊 2507 俞辛 2501 宇航 2502 柏涛 项目宣传 ...
- USACO Section 1.5 Superprime Rib 解题报告
题目 题目描述 超级素数的定义如下:如果有个素数我们从右往左依次去掉一位数,每次去掉一位数剩下的数仍然是素数,那么我们称这个数是超级素数.例如7331,这是一个素数,从右往左依次去掉一位数733, 7 ...