鍍金池/ 問答/數(shù)據(jù)庫  HTML/ vue單頁面應(yīng)用混合開發(fā)手機(jī)app遇到的問題？

vue單頁面應(yīng)用混合開發(fā)手機(jī)app遇到的問題？

在各個子頁面中的想要監(jiān)聽手機(jī)物理返回鍵進(jìn)行指定路由跳轉(zhuǎn)，而不是通過history進(jìn)行一步步跳轉(zhuǎn)，通過在每個子頁面的生命周期mounted上掛載監(jiān)聽方法

mounted () {
    this.addPopState();
},
methods: {
    addPopState() {
        window.addEventListener('popstate',function(){})//popstate事件監(jiān)聽物理返回按鍵
    }
}

但是出現(xiàn)的問題是，在多個頁面中綁定了相同的事件，導(dǎo)致被覆蓋掉了，求問有什么好的解決方法？

跪謝各位了！??！

回答
編輯回答
撥弦

addEventListener可以多次綁定并不會覆蓋上一個事件啊，是否是其他地方影響到了？
像這種事件監(jiān)聽我的做法是在根組件監(jiān)聽然后用$on $emit分發(fā)事件
根組件監(jiān)聽并分發(fā)

window.addEventListener('popstate', () => {
  this.$root.$emit('popstate')
})

各級子組件的任意位置監(jiān)聽

this.$root.$on('popstate', () => {

})
2018年6月21日 19:55
編輯回答
怣人

為什么不在你的父級組件統(tǒng)一來監(jiān)聽事件，再監(jiān)聽路由的變化(to, from)了？

2017年3月23日 23:26
編輯回答
茍活

難了幾天的bug解決了，原因在與混合開發(fā)用到cordova原生的按鈕，導(dǎo)致在頁面觸發(fā)物理返回鍵的時候同時也觸發(fā)了原生的返回鍵，解決方法就是將原生的返回按鈕功能取消，有前端頁面進(jìn)行物理返回鍵的事件綁定，因此觸發(fā)返回鍵的結(jié)果就恢復(fù)正常了。

document.addEventListener("backbutton", onBackKeyDown, false);

function onBackKeyDown() {
    // Handle the back button
}
2018年3月22日 15:08