1. 程式人生 > >vue裡監聽安卓的物理返回鍵

vue裡監聽安卓的物理返回鍵

Hybrid App中,原生內嵌H5單頁,按安卓物理返回鍵的時候會返回到上一個路由,

實際中需求是:當有彈層的時候,按物理返回鍵是關閉彈層,是頁面的時候才執行返回上一個路由,

開始的方案是Android原生重寫方法onKeyDown(),H5 JsBridge js去呼叫方法,當需要的時候遮蔽物理返回鍵,這種方法也能實現

由於H5單頁用的是vue,vue中的路由方法也能實現,並且不需要和APP互動,更加便捷,所以最終決定採用這種方法

只需要寫在路由頁面中

beforeRouteLeave (to, from , next) { // 離開當前路由進行的操作
 // 如果頁面上沒有展示彈層,彈層全部關閉的話,按回退按鈕會執行返回,即到下一個路由
// this.$vux.confirm.isVisible()用來判斷是否顯示vux的confirm彈層 if (!this.showPop&&!this.$vux.confirm.isVisible()) { // 所有彈層都是關閉狀態才執行回退路由 next() } else { this.$vux.confirm.hide() // 關閉confirm彈層 this.showPop = false next(false) // 否則就不到下個路由,而是把各個彈層關閉掉 } },