1.需求:
1.隐藏原生的返回按钮=>由于自带的方法点击时不生效
2.点击离开事件
2.解决:
【1】pages.json
"style": {
"app-plus": {//这个要在上面
"titleNView": {
"autoBackButton": "false",
"buttons": [{
"text": "离开",
"float": "right",
"fontSize": "28upx",
"fontWeight": "normal",
"color": "rgb(0, 0, 0)"
}]
}
},
"navigationBarTitleText": "在线考试内容"
}
【2】index.vue
created(){
document.querySelector('.uni-page-head-hd').style.display = 'none'
},
// 监听原生标题栏按钮点击事件,参数为Object
onNavigationBarButtonTap: function(e) {
const that = this
uni.showModal({
title: '提示',
content: '考试还没有结束,是否确定离开(离开会自动保存)?',
success: function(res) {
if (res.confirm) {
that.submitPapers()
uni.redirectTo({
url: '/pages/index/index'
});
} else if (res.cancel) {
console.log('拒绝离开考试页面');
}
}
});
},
3.问题:
1.返回按钮的显示 autoBackButton不生效
2.onNavigationBarButtonTap不起作用
4.解决方法二:
在pages.json将要隐藏返回箭头的
页面放在最上面
(缺点:登录页面就要隐藏)