前言:
本文记录的是小程序>微信小程序的全局配置、导航栏配置、tabBar配置
一、全局配置:
可以直接查官方文档:pages.json 页面路由 | uni-app官网,有非常详细的文档说明
都是在 pages.json里面做配置的,我们可以看到已经有一些配置了
简单写了一下每句注释:
"globalStyle": {"navigationBarTextStyle": "black",//顶部导航栏文字颜色,只支持black、white"navigationBarTitleText": "uni-app",//全局配置顶部导航栏文字"navigationBarBackgroundColor": "#F8F8F8",//顶部导航栏背景色,只能写16进制,英文单词或rgb会报错"backgroundColor": "#F8F8F8",//下拉背景色"enablePullDownRefresh":true//开启下拉刷新},
注意:
1、已经配置了"navigationBarTitleText": "uni-app"全局配置顶部导航栏文字,但是为什么我的分类页没有显示顶部导航栏的文字呢?
这是因为还有局部的配置 将导航栏文字设置成了空字符串:
2、只设置了backgroundColor之后发现不能下拉,是因为没有设置enablePullDownRefresh,enablePullDownRefresh默认值为false,设置之后效果如下:
二、局部配置
1、局部配置和全局配置的内容差不多,可以参考官方文档,差别就是要写在pages的style里面
2、需要注意的是,局部配置会覆盖全局配置
三、tabBar配置
1、部分常用配置:
"tabBar": {"selectedColor": "#ff5500", //tab 上的文字选中时的颜色"list": [{"pagePath": "pages/home/home", //页面路径"text": "主页", //tab 上按钮文字"iconPath": "static/tabBarIcon/home.png", //图片路径"selectedIconPath": "static/tabBarIcon/home_selected.png" //选中时的图片路径}, {"pagePath": "pages/categorty/categorty","text": "分类","iconPath": "static/tabBarIcon/category.png","selectedIconPath": "static/tabBarIcon/category_selected.png"}, {"pagePath": "pages/mine/mine","text": "个人","iconPath": "static/tabBarIcon/mine_line.png","selectedIconPath": "static/tabBarIcon/mine_line_selected.png"}]},