全局配置: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中的配置值。

  

转载于:https://www.cnblogs.com/Strive-count/p/8985968.html

微信小程序开发教程(六)配置——app.json、page.json详解相关推荐

  1. wxml报错原因_微信小程序开发教程(八)视图层——.wxml详解

    框架的视图层由WXMKL(WeiXin Markup language)与WXSS(WeiXin Style Sheet)编写,由组件进行展示. 对于微信小程序而言,视图层就是所有.wxml文件与.w ...

  2. 微信小程序开发教程!博卡君第二弹【微信小程序项目结构以及配置】

    前面我们转了博卡君通宵吐血赶稿的微信小程序开发教程,当时只更新了两章,现在接着发布第三章:微信小程序项目结构以及配置,第四章:微信小程序首页面开发,以下是微信小程序教程 找到创建的 demo 文件夹, ...

  3. 微信小程序开发教程:项目六媒体组件 课后习题

    <微信小程序开发教程>主编/黄寿孟 易芳 陶延涛 湖南大学出版社 目录 一.单选题 二.多选题 三.判断题 四.填空题 五.简答题 请简单列举音频接口API创建的InnerAudioCon ...

  4. 微信小程序开发教程:项目四组件布局 课后习题

    <微信小程序开发教程>主编/黄寿孟 易芳 陶延涛 湖南大学出版社 目录 一.单选题 二.多选题 三.判断题 四.填空题 五.简答题 1.请简单地介绍微信小程序flex布局的使用. 2.如何 ...

  5. 微信小程序开发教程:项目三表单组件 课后习题

    <微信小程序开发教程>主编/黄寿孟 易芳 陶延涛 湖南大学出版社 目录 一.单选题 二.多选题 三.判断题 四.填空题 五.简答题 1.请简单描述搭建node后台服务器的过程. 2.在调查 ...

  6. 微信小程序开发教程第七章:微信小程序编辑名片页面开发

    前面我们更新了六篇的微信小程序开发教程,现在更新第七章:微信小程序编辑名片页面开发,(第一二章:微信小程序开发教程,第三四章:微信小程序项目结构以及配置&微信小程序首页面开发,第五章:微信小程 ...

  7. 微信小程序开发教程第八章:微信小程序分组开发与左滑功能实现

    接着上面微信小程序开发教程第八章:微信小程序分组开发与左滑功能实现.(第一二章:微信小程序开发教程,第三四章:微信小程序项目结构以及配置&微信小程序首页面开发,第五章:微信小程序名片夹详情页开 ...

  8. 微信小程序开发语言(微信小程序开发教程)详细步骤

    微信小程序开发语言 开发微信小程序用什么语言 1.微信小程序开发所需要的语言比较特别,首先介绍一下需要使用到的文件类型大致分为:WXML(WeiXin Mark Language 微信标记语言).WX ...

  9. 零基础入门,花生壳骨灰级微信小程序开发教程

    微信小程序早已成为企业运营必不可少的一部分,对于小程序的开发需求也只增不减,而一个小程序在使用过程中是否流畅,也关系者用户体验度. 微信小程序的优势和特点: 一.不占内存 现在很多人都会遇到手机内存不 ...

  10. 微信小程序装修解决方案ppt_微信小程序开发教程.ppt

    微信小程序开发教程.ppt 从开发CMS系统学起 从入门到精通的微信小程序开发教程 学微信小程序开发 从实践中学习是开发者最好最快的学习方法.本教程将和大家从零开始 一步一步搭建微信小程序CMS系统, ...

最新文章

  1. 在CentOS 6.9 x86_64的nginx 1.12.2上开启ngx_req_status模块实录
  2. windows server 更改默认服务端口
  3. oracle 函数to_char(数据,'FM999,999,999,999,990.00') 格式化数据
  4. 20145233《网络对抗》Exp8 Web基础
  5. 自己做的一个水印生成类
  6. Windows 7无线路由器解决
  7. 在内核中实现URL重定向
  8. 【愚公系列】2022年01月 Django商城项目16-用户中心-地址管理之省市三联动功能实现
  9. Linux操作系统优化
  10. 第二章 确定性知识系统
  11. iphone6s html5没声音,iphone6S来电没声音怎么回事?解决iphone来电没声音的方法
  12. 用Excel理解神经网络
  13. 研究亥姆霍兹线圈轴线磁场分布
  14. 计算机专英语第6版翻译10.2,2010年6月英语六级翻译题模拟训练附答案 第2期
  15. spring边边角角
  16. 油烟净化器电场可以使用洗衣粉来清洗吗?
  17. WPF-10 逻辑树和可视化树
  18. Docker数据卷和网络管理 下
  19. 210. 课程表 II kahn求拓扑图算法
  20. Java项目:SSM健身房俱乐部管理系统

热门文章

  1. DataGridView DataGridViewCheckBoxColumn编辑时实时触发事件
  2. PRML-系列一之1.2.4
  3. js 绘制泳道图_软件工程师,如何绘制业务架构图 — 4.流程图
  4. leetcode —— 863. 二叉树中所有距离为 K 的结点
  5. leetcode - 221. 最大正方形
  6. SQL避免IN 和 NOT IN
  7. vba 将xml导入到excel
  8. react怎么连接打印机_怎么连接同事已共享的打印机?
  9. vue获取编辑器纯文字_前端富文本编辑器 vue-html5-editor
  10. php thikn_与ThinkPHP等框架结合