动态添加及修改导航栏
小于 1 分钟
动态添加及修改导航栏
uni.setNavigationBarTitle({
title: '案例详情'
})
在pages.json
{
"path": "pages/cart/cart",
"style": {
"navigationBarTitleText": "购物车",
"navigationBarBackgroundColor":"#FFFFFF",
"app-plus": {
"titleNView": {
"titleAlign":"left",
"titleSize":"40rpx",
// "autoBackButton":"false",
"buttons":[
{
"text":"编辑",
"float":"right",//表示显示在导航栏右侧,,左侧就改成left'
"fontSize":"32rpx"
}
]
}
}
}
},
要实现效果的页面中
动态修改右侧或左侧内容
var webView = this.$mp.page.$getAppWebview();
// 修改buttons
// index: 按钮索引, style {WebviewTitleNViewButtonStyles }
webView.setTitleNViewButtonStyle(0, {
text: 'hello',
});
// 修改按钮上的角标
// index: 按钮索引, text: 角标文本内容
webView.setTitleNViewButtonBadge({
index: 0,
text: 10,
});