微信小程序——2、配置json文件
配置文件详解
主配置文件app.json
主配置文件位于主目录中,用于进行全局配置。包括页面文件的路径、窗口表现、设置网络超时时间、设置多tab等
下面通过微信最初自带小程序来学习
{
"pages":[
"pages/index/index",
"pages/logs/logs"
],
"window":{
"backgroundTextStyle":"light",
"navigationBarBackgroundColor": "#fff",
"navigationBarTitleText": "WeChat",
"navigationBarTextStyle":"black"
}
}
这是微信小程序自带的配置文件app.json
pages
"pages":[]用来定义小程序中所用到的界面,是一个数组,上面代码中有两个值位于pages/index下的index文件和pages/logs下的logs文件
window
"window":{}文件用来定义窗口的表现形式,例如"navigationBarTitleText": "WeChat",表示设置窗口标题为WeChat
配置窗口状态
backgroundColor:用来设置窗口背景颜色,使用十六进制的RGB方式设置
backgroundTextStyle:设置下拉背景字体,loading图的样式,只支持设置为"dark""light",默认为"dark"
navigationBarBackgroundColor:用来设置窗口的背景颜色,采用十六进制的RGB方式设置
enablePullDownRefresh:设置下拉是否刷新
navigationBarTitleStyle:导航栏标题颜色
tabBar
配置窗口底部tabBar
"tabBar":{
"color":"#dddddd",
"selectedColor":"#3cc51f",
"borderStyle":"black",
"backgroundColor":"#ffffff",
"list":[{
"pagePath":"page/component/index",
"iconPath":"image/icon_component.png",
"selectedIconPath":"image/icon_component_HL.png",
"text":"组件",
},{
"pagePath":"page/API/index/index",
"iconpath":"image/icon_API.png",
"selectedIconPath":"image/icon_API_HL.png",
"text":"接口"
}
]
}
tabBar中有5个属性可以设置
- color:设置tab未激活状态文字的颜色
- selectedColor:设置tab激活文字状态的颜色
- boredStyle:设置tabBar上边框的颜色,白与黑
- backgroundColor:设置tab背景的颜色
- list:这是一个数,设置tab列表项,最少两个最多五个。list有四个属性值:
- text:设置tab上显示的文字
- iconPath:tab处于未激活状态时的图片路径,icon照片大小限制为40kb
- pagePath:设置触按tab时跳转的路径
其他配置
networkTimeout
微信小程序中有多种网络连接,可以通过参数"networkTimeout"设置网络请求的超时时间。
"networkTimeout": {
"request": 20000,
"connectSocket": 20000,
"uploadFile": 20000,
"downloadFile": 20000
}
- request:设置网络请求接口的超时时间
- connectSocket设置wx.connectSocket接口网络请求的超时时间
- downloadFile:设置wx.downloadFile下载文件接口超时时间
- uploadFile:上传文件接口超时时间
页面配置文件
主配置文件配置项很多但是是全局的,每个页面都可以使用。但是窗口标题每个页面都有不同的标题,每个页面也需要一个页面配置文件来对这些项目进行配置。
页面配置只能设置主配置文件中window的配置项内容,无需写window键,页面配置会自动覆盖主配置中的内容。
微信小程序——2、配置json文件的更多相关文章
- 微信小程序-01-项目组成文件介绍(入门篇)
自古开篇先说两句,写这些笔记不是学习用的,主要是后续分享一些遇到的坑,碰到过什么样的问题,怎么去解决,如果你不是一个很耐心无看文章的人,建议去 网易云课堂找一些课程,跟着别人的脚步或许会更有动力,我的 ...
- 微信小程序--代码构成---JSON 配置
在上一章中,我们通过开发者工具快速创建了一个 QuickStart 项目.你可以留意到这个项目里边生成了不同类型的文件: .json 后缀的 JSON 配置文件 .wxml 后缀的 WXML 模板文件 ...
- 小程序学习一 .json 文件配置
微信小程序——配置 以下就是小编对小程序配置的资料进行的系统的整理,希望能对开发者有帮助. 我们使用app.json文件来对微信小程序进行全局配置,决定页面文件的路径.窗口表现.设置网络超时时间.设置 ...
- 微信小程序开发---各代码文件简介
根据上一文,已建立QuickStart 项目,该项目系本人毕设部分内容,所以记录以便以后查阅 开发小程序就必须了解小程序项目目录结构和文件作用,接下来就根据我现在自学得到的知识把这些记录下来. 一.目 ...
- 微信小程序day01-JSON配置
微信小程序 小程序代码构成 JSON配置WXML模板WXSS样式JS逻辑 1.JSON配置 小程序配置 app.json app.json: 是当前小程序的全局配置,包括了小程序的所有页面路径.界面表 ...
- 微信小程序环境下将文件上传到 OSS
步骤 1: 配置 Bucket 跨域 客户端进行表单直传到 OSS 时,会从浏览器向 OSS 发送带有 Origin 的请求消息.OSS 对带有 Origin 头的请求消息会进行跨域规则(CORS)的 ...
- 微信小程序的配置详解
1.配置详解: 使用app.json文件来对微信小程序进行全局配置,决定页面文件的路径.窗口表现.设置网络超时时间.设置多 tab 等. 1>pages 接受一个数组,每一项都是字符串,来指定小 ...
- 微信小程序 WXS实现json数据需要做过滤转义(filter)
前言 最近有在做小程序开发,在开发的过程中碰到一点小问题,描述一下先. 本人在职的公司对于后台获取的 json 数据需要做过滤转义的很多,不同的状态码会对应不同的文字,但是在微信小程序中又没有类似 v ...
- 微信小程序环境配置和开发!!
1.登陆微信公众平台小程序,下载 普通小程序开发者工具.或者 小游戏开发者工具. 2.新建项目需要填以下几点,然后初始demo如下,注意rpx是分成750份的单位. 3.点击预览,用微信扫描二维码,代 ...
- 微信小程序动态修改title,动态配置title,动态配置头部,微信小程序动态配置头部
微信小程序的title是在json里面配置的 "navigationBarTitleText": "title名称" 这种title是固定死的不灵活处理一些页面 ...
随机推荐
- CodeForces - 768C Jon Snow and his Favourite Number 桶排
https://vjudge.net/problem/CodeForces-768C 题意:n个数,k次操作,x.每次操作先排序,再让奇数位置上的数据a[i]:=a[i] XOR x; k< ...
- MyBatis 强大之处 多环境 多数据源 ResultMap 的设计思想是 缓存算法 跨数据库 spring boot rest api mybaits limit 传参
总结: 1.mybaits配置工2方面: i行为配置,如数据源的实现是否利用池pool的概念(POOLED – This implementation of DataSource pools JDBC ...
- python 时间字符串和时间戳之间的转换
https://blog.csdn.net/qq_37193537/article/details/78987949 1.将字符串的时间转换为时间戳 方法: a = " ...
- 洛谷P3826 蔬菜 [NOI2017] 贪心
正解:贪心 解题报告: umm,,,其实我还不会 废话我这么菜怎么可能懂QAQ 先占坑,想学习这题很久了呢QAQ
- 洛谷P1941 飞扬的小鸟 [noip2014] 背包
正解:背包 解题报告: 话说好久没做背包的题了,都有些陌生了?这几天加强基础题目多刷点儿dp和背包趴qwq 其实这题是95...然后我下了我错的那个测试点,我答案是9874正解是9875...然后读入 ...
- 正则表达式(三):Unicode诸问题下篇(转)
原文:http://www.infoq.com/cn/news/2011/04/regular-expressions-4 我们使用正则表达式,熟练掌握各种功能和结构只是手段,解决实际的问题才是真正的 ...
- GOLANG错误处理最佳方案errors wrap, Defer, Panic, and Recover
Simple error handling primitives: https://github.com/pkg/errors Defer, Panic, and Recover: ...
- [py]python的继承体系-源码目录结构
python3安装目录 pip install virtualenv pip install virtualenvwrapper pip install virtualenvwrapper-win m ...
- 百度编辑器UEditor源码模式下过滤div/style等html标签
UEditor在html代码模式下,当输入带有<div style="">.<iframe>这类带有html标签的内容时,切换为编辑器模式后,会发现输入的内 ...
- JavaScrip总体
js: 简单对象: 数字 | 字符串 | 这三个像对象,有方法,但不可变 布尔值 | null undefined 对象:无类型,k-v对集合:函数.数组.REG.... JavaScript是一种l ...