uni-app APP 中动态显示右上角按钮
uni-app APP 中动态显示右上角按钮方案1 需要配合pages.json 配置实现// 在要显示按钮的配置右上角按钮配置,并把文字颜色设置为页面背景色{"path": "pages/instock/sub-pages/subIntoWork","style": {"navigationBarTitleText": "","enablePullDownRefresh": false,"onR
·
uni-app APP 中动态显示右上角按钮
方案1 需要配合pages.json 配置实现
// 在要显示按钮的配置右上角按钮配置,并把文字颜色设置为页面背景色
{
"path": "pages/instock/sub-pages/subIntoWork",
"style": {
"navigationBarTitleText": "",
"enablePullDownRefresh": false,
"onReachBottomDistance": 100,
"app-plus": {
"titleNView": {
"buttons": [{
"text": "操作",
"fontSize": "30rpx",
"color":"transparent",
"width": "auto" // 防止按钮显示不全
}]
}
}
}
},
// 在页面文件中 通过判断修改按钮颜色
const webView = this.$mp.page.$getAppWebview();
webView.setTitleNViewButtonStyle(0, {
"color":"#6281dd"
});
这种方法的缺陷
1、麻烦,不能一步设置完成,还需要配合背景色
2、onNavigationBarButtonTap 中进行判断是否进行下一步操作
// 这个两个方法也可以实现显示按钮,也需要配合pages.json中buttons的配置才能显示
webView.setTitleNViewButtonBadge({
index: 0,
text: 10,
});
webView.setTitleNViewButtonStyle(0, {
"color":"#6281dd"
});
更多推荐
已为社区贡献2条内容
所有评论(0)