微信小程序——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是固定死的不灵活处理一些页面 ...
随机推荐
- oracle trunc 函数处理日期格式,日期类型很有用的几个sql
select to_char(sysdate,'yyyy-mm-dd hh24:mi:ss') from dual; --显示当前时间2011-12-29 16:24:34 select trunc ...
- 数据恢复:如何恢复Linux中意外删除的Oracle和MySQL数据库
今天有客户的数据库意外被删除了整个目录中的数据文件,操作系统级别的删除,然而幸运的是这个数据库没有崩溃,仍然处于 open 状态的时候,客户就发现了问题,求助到我们,最终完整地恢复了所有数据文件. 在 ...
- ZB api
本文介绍ZB api Rest API (已开启) ZB为用户提供了一个简单的而又强大的API,旨在帮助用户快速高效的将ZB交易功能整合到自己应用当中. 如果在使用过程中有任何问题,请加群764113 ...
- mysql 数据操作 多表查询 多表连接查询 全外连接
全外连接:显示左右两个表全部记录 全外连接 在内连接的基础上保留左右两表没有对应关系的记录 full join #注意:mysql不支持全外连接 full JOIN mysql> select ...
- Python3学习之路~2.6 集合操作
集合是一个无序的,不重复的数据组合,它的主要作用如下: 去重,把一个列表变成集合,就自动去重了 关系测试,测试两组数据之前的交集.差集.并集等关系 常用操作 >>> list1 = ...
- 2.搭建cassandra时遇到没有公网网卡的问题
阿里云服务器有两种网络,一种是经典网络,一种是专用网络,经典网络是公网网卡的,但是专用网络是没有公网网卡的. 如图: 经典网络,公网ip是139.129.31.108: 专用网络,公网ip是 问题: ...
- hdu1542 Atlantis(矩阵面积的并)
这个题算是我的第一个扫描线的题,扫描线算是一种思想吧,用到线段树+离散化.感觉高大上. 主要参考了这位大神的博客. http://www.cnblogs.com/kuangbin/archive/20 ...
- PAT 1030 Travel Plan[图论][难]
1030 Travel Plan (30)(30 分) A traveler's map gives the distances between cities along the highways, ...
- php array_rand()函数从数组中随机选择一个或多个元素
php使用array_rand()函数从数组中随机选择一个或多个元素的方法. 使用array_rand() 函数从数组中随机选出一个或多个元素,并返回. array_rand(array,numbe ...
- python sys.path[0] 的解释
sys.path是python的搜索模块的路径集,返回的结果是一个list path[0] 此列表的第一项,path[0],在程序启动时初始化,是包含用来调用Python解释器的脚本的目录.如果脚本目 ...