小程序配置文件app.json和page.json(小程序的状态栏、导航条、标题、窗口背景色|、下拉刷新)

小程序app.json配置文件

小程序配置文件app.json和page.json(小程序的状态栏、导航条、标题、窗口背景色|、下拉刷新)
(1)小程序/全局配置文件
小程序根目录下的 app.json 文件用来对微信小程序进行全局配置
文件内容本质就是一个 JSON 对象。
小程序配置文件app.json和page.json(小程序的状态栏、导航条、标题、窗口背景色|、下拉刷新)
(2)小程序/全局配置文件------>pages属性
作用: 用于指定小程序由哪些页面组成,每一项都对应一个页面的 路径(含文件名) 信息。文件名不需要写文件后缀,框架会自动去寻找对于位置的 .json, .js, .wxml, .wxss 四个文件进行处理。
注意: 数组的第一项代表小程序的初始页面(首页)。小程序中新增/减少页面,都会对 pages 数组自动进行修改。

(3)小程序/全局配置文件------>sitemapLocation属性
作用:指明 sitemap.json 的位置;默认为 ‘sitemap.json’ 即在 app.json 同级目录下名字的 sitemap.json 文件
sitemap.json为小程序收录设置文件,默认所有页面都能被索引,开发中一般不用进行相关配置
(4)小程序/全局配置文件------>window属性
小程序配置文件app.json和page.json(小程序的状态栏、导航条、标题、窗口背景色|、下拉刷新)

window属性~下拉刷新

**(1)新建一个空白页,**例如home页,建好后会发现home.js文件中已经写好各个阶段钩子函数。观察后发现onPullDownRefresh下拉函数,这里添加验证代码,输出验证。
小程序配置文件app.json和page.json(小程序的状态栏、导航条、标题、窗口背景色|、下拉刷新)
(2)配置enablePullDownRefresh(这时下拉无效)
然而下拉后发现触发不了js回调,因为下拉功能需要配置,才可以支持下拉功能,即 enablePullDownRefresh设置为true
小程序配置文件app.json和page.json(小程序的状态栏、导航条、标题、窗口背景色|、下拉刷新)
注意:
①如果是在小程序配置文件app.json中设置该字段,则小程序下的所有页面都可以下拉
②如果在页面配置文件page.json设置该字段,则只能在当前设置过字段的页面执行下拉操作
③开发建议:只在需要执行下拉操作的页面设置该字段即可,例如本例中的home页面。
(3)下拉 loading 的样式
小程序配置文件app.json和page.json(小程序的状态栏、导航条、标题、窗口背景色|、下拉刷新)
而此时小程序顶部一片空白
(4)窗口背景色
因为背景是白色的,由于颜色的缘故,三个点闪烁的动画看不到,因此背景需要进行以下配置:
小程序配置文件app.json和page.json(小程序的状态栏、导航条、标题、窗口背景色|、下拉刷新)
(5)loading样式
小程序配置文件app.json和page.json(小程序的状态栏、导航条、标题、窗口背景色|、下拉刷新)
(6)真机下拉bug
经过之前步骤,已经可以在模拟器实现下拉效果,但真机测试后容易出现不缩回的现象,这时可以在下拉监听事件中添加手动缩回的代码。
方案:微信小程序还提供了停止下拉刷新效果的api,如果发现进入刷新状态,无法停止,可以使用wx.stopPullDownRefresh这个api
小程序配置文件app.json和page.json(小程序的状态栏、导航条、标题、窗口背景色|、下拉刷新)

页面配置文件page.json

作用: 对本页面的窗口表现进行配置,文件内容本质为一个 JSON 对象
场景:如果整个小程序的风格是蓝色调,那么在 app.json 里边声明顶部颜色是蓝色即可。实际情况可能不是这样,可能你小程序里边的每个页面都有不一样的色调来区分不同功能模块,因此小程序提供了 page.json,让开发者可以独立定义每个页面的一些属性,例如顶部颜色、是否允许下拉刷新等等。
简单理解:就是对单个小程序页面的配置,可以覆盖全局配置app.json。
特性:覆盖性,即每一个小程序页面可以使用同名 .json 文件来对本页面的窗口表现进行配置,但页面中配置项会覆盖 app.json 的 window 中相同的配置项。

(1)常用配置项属性
小程序配置文件app.json和page.json(小程序的状态栏、导航条、标题、窗口背景色|、下拉刷新)
小程序配置文件app.json和page.json(小程序的状态栏、导航条、标题、窗口背景色|、下拉刷新)

以上便是小程序配置文件 app.json和页面配置文件 page.json的相关介绍。

别名:小程序配置也叫全局配置,页面配置也叫局部配置。
重点
①覆盖性:页面配置文件相关设置会覆盖小程序配置文件中已有配置
②书写格式:页面配置中只能设置 app.json 中 window 对应的配置项,以决定本页面的窗口表现,所以无需写 window 这个属性
③JSON语法格式及相关限制