微信小程序_5,页面配置
发布时间：2024-03-26 10:01
1.页面配置文件的作用:
小程序中,每个页面都有自己的.json配置文件,用来对当前页面的窗口外观,页面效果等进行配置
2.页面配置和全局配置的关系:
小程序中,app.json中的window节点,可以全局配置小程序中每个页面的窗口表现
如果某些小程序页面想要拥有特殊的窗口表现,此时"页面级别的.json配置文件"就可以实现这种需求.
注意:当页面配置与全局配置冲突时,根据就近原则,最终的效果以页面配置为准
3.页面配置中常用的配置项:
| 属性 | 类型 | 默认值 | 描述 |
|---|---|---|---|
| navigationBarBackgroundColor | HexColor | #000000 | 当前页面导航栏背景颜色,如:#000000 |
| navigationBarTextStyle | String | white | 当前页面导航栏标题颜色,仅支持black/white |
| navigationBarTitleText | String | 当前页面导航栏标题文字内容 | |
| backgroundColor | HexColoir | #ffffff | 当前页面窗口的背景色 |
| backgroundTextStyle | String | dark | 当前页面下拉loading的样式,仅支持dark/light |
| enablePullDownRefresh | Boolean | false | 当前页面开启下拉刷新的效果 |
| onReachBottomDistance | Number | 50 | 页面上拉触底事件时距页面底部距离,单位为px |
例如:
index的WXML:
{
"usingComponents": {},
"navigationBarBackgroundColor": "#b771ba",
"navigationBarTitleText": "index页面",
"backgroundColor": "#ba0404"
}
person的WXML:
{
"usingComponents": {},
"navigationBarBackgroundColor": "#6b426d",
"navigationBarTitleText": "person页面",
"backgroundColor": "#845286"
}
- 注意这里不推荐把下拉刷新的配置放在全局,一般放在需要下拉刷新的页面配置中:
{
"usingComponents": {},
"navigationBarBackgroundColor": "#6b426d",
"navigationBarTitleText": "person页面",
"backgroundColor": "#845286",
"enablePullDownRefresh": true
}