混合开发监听安卓手机物理返回键

在用h5做混合开发过程中由于有个考试考试页面，中途不能退出，退出要添加确认操作，所以需要监听手机的返回操作，不让用户直接通过返回键返回

目前了解到混合开发中有两种方式监听。

方式一，监听popstate，用到的属性window.history

mounted () {// 挂载完成后，判断是否支持popstate,监听手机返回键if (window.history && window.history.pushState) {history.pushState(null, null, document.URL)window.addEventListener('popstate', this.goBack, false)}},destroyed () {// 页面销毁时，取消监听，否则其他vue路由页面也会被监听window.removeEventListener('popstate', this.goBack, false)},methods: {//处理业务逻辑goBack () {this.rrxShow = !this.rrxShow},}

问题

popstate只是能监听到手机返回操作，但是不会拦截后续操作，比如反复触发返回，控制确认框显隐，需要自己去写业务逻辑处理，并且需要移除监听再添加监听，不然影响其他页面的返回操作，有可能其他页面返回几次都无法返回。

好处是不用引用其他插件，只要做好逻辑控，还是挺好用的。

方式二，监听backbutton，cordova+vue，需要依赖cordova

不需要担心监听失效，直接在回调函数写相应方法即可，记得在页面销毁和取消操作后移除监听即可

mounted () {document.addEventListener('backbutton', this.goBack,false)},destroyed () {// 页面销毁时，取消监听document.removeEventListener('backbutton', this.goBack,false)},methods:{goBack () {this.show = !this.show},}

如果觉得《混合开发监听安卓手机物理返回键》对你有帮助，请点赞、收藏，并留下你的观点哦！