popupMode.js
1.07 KB
// 【操作逻辑优化】当前页面内有弹窗时,返回应该是关闭弹窗,而不是返回上一页
function getSetLastItem(set) {
console.log(set, 'set')
return Array.from(set)[set.size - 1]
}
export default {
data() {
return {
CURRENT_POPUP_STATUS_SET: new Set(),
}
},
created() {
this.$root.$on('TOGGLE_POPUP', (status) => {
this.CURRENT_POPUP_STATUS_SET = status
})
},
beforeRouteLeave(to, from, next){
// 如何判断一个弹出层是否正在显示
if (this.CURRENT_POPUP_STATUS_SET.size){
//判断弹出层正在显示
//将路由前进一步,在路由历史中,前进一步则是当前页面
this.$router.go(1)
// 一般认为,层叠的popup都是有序的,后边打开的的在上边,所以先关闭最上边的 popup
// 通知组件 关闭set数组最后一个弹窗
this.$root.$emit('CLOSE_POPUP', getSetLastItem(this.CURRENT_POPUP_STATUS_SET))
return
}
//当弹出层处于隐藏状态时,点击返回则直接跳转页面,不做任何操作
next()
},
}