小程序配置-全局配置和页面配置

224 阅读2分钟

全局配置

window节点

app.json中的window节点。

全局定义小程序所有页面的背景色、文字颜色等

8.jpg

window节点常用配置项

属性名类型默认值说明
navigationBarTitleTextString字符串导航栏标题文字内容
navigationBarBackgroundColorHexColor#000000导航栏背景颜色
navigationBarTextStyleStringWhite导航栏标题颜色,仅支持black/white
navigationBarTitleTextString字符串导航栏标题文字内容
backgroundColorHexColor#ffffff窗口的背景色
backgroundTextStyleStringdark下拉loading的样式,仅支持dark/light
enablePullDownRefreshBooleanfalse是否全局开启下拉刷新。在app.json中启用下拉刷新功能,会作用于每个小程序页面
onReachBottomDistanceNumber50页面上拉触底事件触发时距页面底部距离,单位为px。建议使用默认值即可

tabBar

tabBar是移动端应用常见的页面效果,用于实现多页面的快速切换,也就是导航栏。分为

  • 底部tabBar
  • 顶部tabBar

注意

  • tabBar中只能配置最少2个、最多5个tab标签
  • 当渲染顶部tabBar时,不显示icon图标,只显示文本

tabBar的6个组成部分

组成部分作用
backgroundColortabBar的背景颜色
borderStyletabBar上边框的颜色
colortab上文字的默认颜色(未选中时颜色)
selectedColortab上文字选中时的颜色
iconPathtab未选中时的图片路径(图标
selectedIconPathtab选中时的图片路径(图标

tabBar节点配置项

配置项类型必填默认值描述
positionStringbottomtabBar的位置,仅支持bottom/top
borderStyleStringblacktabBar上边框颜色,仅支持black/white
colorHexColortab上文字的默认(未选中)颜色
selectedColorHexColortab上文字选中时的颜色
backgroundColorHexColortabBar的背景颜色
listArraytab页签的列表,最少2个、最多5个tab

每个tab项的配置项

配置项类型必填描述
pagePathString页面路径,页面必须在pages中预先预定
textStringtab上显示的文字
iconPathStringtab未选中时的图标路径;当position为top时,不显示icon
selectedIconPathStringtab选中时的图标路径;当position为top时,不显示icon

注意 tab项的对应页面需要在pages配置项属性值的多个页面前存放,否则点击tab页签时显示不出页面

页面配置

页面中的.json配置文件,对当前页面的窗口外观、页面效果等进行配置

注意 当全局配置与页面配置冲突时,根据就近原则,最终以页面配置为准

配置项和全局配置项相同