通过 npm 安装vant-weapp
https://youzan.github.io/vant-weapp/#/quickstart
1.系统导航
{
"usingComponents": {},
"navigationBarBackgroundColor": "#6495ED",
"navigationBarTextStyle": "white",
"navigationBarTitleText": "首页",
"navigationStyle": "custom",
"backgroundColor": "#000",
"enablePullDownRefresh": false
}
配置.json字段说明
"navigationStyle": "custom"
引入文件
"usingComponents": {},
导航背景颜色
"navigationBarBackgroundColor": "#6495ED",
导航文字颜色
"navigationBarTextStyle": "white",
导航标题
"navigationBarTitleText": "首页",
背景颜色
"backgroundColor": "#000",
是否允许下拉刷新
"enablePullDownRefresh": false
如需所有的页面都这样展示的话,那需要在全局文件app.json里的window里设置。
"window": {
"backgroundTextStyle": "light",
"navigationBarBackgroundColor": "#fff",
"navigationBarTitleText": "Weixin",
"navigationBarTextStyle": "black",
"navigationStyle": "custom", // 自定义导航栏配置
},
1.自定义导航
在需要设置头部导航栏的页面中通过json配置 "navigationStyle": "custom" ,自定义导航栏,只保留胶囊按钮
网友评论