配置文件详解

主配置文件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文件的更多相关文章

  1. 微信小程序-01-项目组成文件介绍(入门篇)

    自古开篇先说两句,写这些笔记不是学习用的,主要是后续分享一些遇到的坑,碰到过什么样的问题,怎么去解决,如果你不是一个很耐心无看文章的人,建议去 网易云课堂找一些课程,跟着别人的脚步或许会更有动力,我的 ...

  2. 微信小程序--代码构成---JSON 配置

    在上一章中,我们通过开发者工具快速创建了一个 QuickStart 项目.你可以留意到这个项目里边生成了不同类型的文件: .json 后缀的 JSON 配置文件 .wxml 后缀的 WXML 模板文件 ...

  3. 小程序学习一 .json 文件配置

    微信小程序——配置 以下就是小编对小程序配置的资料进行的系统的整理,希望能对开发者有帮助. 我们使用app.json文件来对微信小程序进行全局配置,决定页面文件的路径.窗口表现.设置网络超时时间.设置 ...

  4. 微信小程序开发---各代码文件简介

    根据上一文,已建立QuickStart 项目,该项目系本人毕设部分内容,所以记录以便以后查阅 开发小程序就必须了解小程序项目目录结构和文件作用,接下来就根据我现在自学得到的知识把这些记录下来. 一.目 ...

  5. 微信小程序day01-JSON配置

    微信小程序 小程序代码构成 JSON配置WXML模板WXSS样式JS逻辑 1.JSON配置 小程序配置 app.json app.json: 是当前小程序的全局配置,包括了小程序的所有页面路径.界面表 ...

  6. 微信小程序环境下将文件上传到 OSS

    步骤 1: 配置 Bucket 跨域 客户端进行表单直传到 OSS 时,会从浏览器向 OSS 发送带有 Origin 的请求消息.OSS 对带有 Origin 头的请求消息会进行跨域规则(CORS)的 ...

  7. 微信小程序的配置详解

    1.配置详解: 使用app.json文件来对微信小程序进行全局配置,决定页面文件的路径.窗口表现.设置网络超时时间.设置多 tab 等. 1>pages 接受一个数组,每一项都是字符串,来指定小 ...

  8. 微信小程序 WXS实现json数据需要做过滤转义(filter)

    前言 最近有在做小程序开发,在开发的过程中碰到一点小问题,描述一下先. 本人在职的公司对于后台获取的 json 数据需要做过滤转义的很多,不同的状态码会对应不同的文字,但是在微信小程序中又没有类似 v ...

  9. 微信小程序环境配置和开发!!

    1.登陆微信公众平台小程序,下载 普通小程序开发者工具.或者 小游戏开发者工具. 2.新建项目需要填以下几点,然后初始demo如下,注意rpx是分成750份的单位. 3.点击预览,用微信扫描二维码,代 ...

  10. 微信小程序动态修改title,动态配置title,动态配置头部,微信小程序动态配置头部

    微信小程序的title是在json里面配置的 "navigationBarTitleText": "title名称" 这种title是固定死的不灵活处理一些页面 ...

随机推荐

  1. CodeForces - 768C Jon Snow and his Favourite Number 桶排

    https://vjudge.net/problem/CodeForces-768C 题意:n个数,k次操作,x.每次操作先排序,再让奇数位置上的数据a[i]:=a[i] XOR x;   k< ...

  2. MyBatis 强大之处 多环境 多数据源 ResultMap 的设计思想是 缓存算法 跨数据库 spring boot rest api mybaits limit 传参

    总结: 1.mybaits配置工2方面: i行为配置,如数据源的实现是否利用池pool的概念(POOLED – This implementation of DataSource pools JDBC ...

  3. python 时间字符串和时间戳之间的转换

    https://blog.csdn.net/qq_37193537/article/details/78987949   1.将字符串的时间转换为时间戳    方法:        a = " ...

  4. 洛谷P3826 蔬菜 [NOI2017] 贪心

    正解:贪心 解题报告: umm,,,其实我还不会 废话我这么菜怎么可能懂QAQ 先占坑,想学习这题很久了呢QAQ

  5. 洛谷P1941 飞扬的小鸟 [noip2014] 背包

    正解:背包 解题报告: 话说好久没做背包的题了,都有些陌生了?这几天加强基础题目多刷点儿dp和背包趴qwq 其实这题是95...然后我下了我错的那个测试点,我答案是9874正解是9875...然后读入 ...

  6. 正则表达式(三):Unicode诸问题下篇(转)

    原文:http://www.infoq.com/cn/news/2011/04/regular-expressions-4 我们使用正则表达式,熟练掌握各种功能和结构只是手段,解决实际的问题才是真正的 ...

  7. GOLANG错误处理最佳方案errors wrap, Defer, Panic, and Recover

    Simple error handling primitives:        https://github.com/pkg/errors Defer, Panic, and Recover:    ...

  8. [py]python的继承体系-源码目录结构

    python3安装目录 pip install virtualenv pip install virtualenvwrapper pip install virtualenvwrapper-win m ...

  9. 百度编辑器UEditor源码模式下过滤div/style等html标签

    UEditor在html代码模式下,当输入带有<div style="">.<iframe>这类带有html标签的内容时,切换为编辑器模式后,会发现输入的内 ...

  10. JavaScrip总体

    js: 简单对象: 数字 | 字符串 | 这三个像对象,有方法,但不可变 布尔值 | null undefined 对象:无类型,k-v对集合:函数.数组.REG.... JavaScript是一种l ...