欢迎您访问程序员文章站本站旨在为大家提供分享程序员计算机编程知识!
您现在的位置是: 首页  >  科技

物理返回键事件处理

程序员文章站 2022-06-15 21:18:28
物理返回键1)app内:在app1上,H5和app约定好在window对象上定义一个全局的方法,比如window.back方法,H5会在路由定义位置,定义该方法。当触发物理返回键的时候,app会监听双方定义好的方法back,如果有定义该方法,则执行方法2)非app内,比如浏览器,微信等环境,使用popstate方法监听这里处理的时候,需要区分是路由触发的还是物理触发的,路由触发popostate()方法,则不执行物理事件处理(由于router.replace()和router.push()方法....

物理返回键

1)app内:
在app1上,H5和app约定好在window对象上定义一个全局的方法,比如window.back方法,H5会在路由定义位置,定义该方法。当触发物理返回键的时候,app会监听双方定义好的方法back,如果有定义该方法,则执行方法

2)非app内,比如浏览器,微信等环境,使用popstate方法监听 
这里处理的时候,需要区分是路由触发的还是物理触发的,路由触发popostate()方法,则不执行物理事件处理(由于router.replace()和router.push()方法也会触发popstate()方法),所以需要用一个标识,表示是路由触发的popstate方法,路由触发的就不调用处理物理键返回的方法,物理键触发的popstate方法,才调用物理键返回方法

3)sdk方式接入app内
也是H5和app双方约定好的相应方法


app1的物理返回键的方法:
window.back(适用ios  android)返回值说明:
return 0: 关闭当前web view
return 1:  正常返回上一页
return 2:  什么都不做

插件形式,E企宝物理返回键的方法:
window.onBackForward(适用android. iOS)返回值说明:
return 0: 什么都不做
return 1: 正常返回上一页

 

在router/index.js里面定义了router对象,然后通过该对象可以获取到的信息
let history = router.history
history = {
   base: ‘’,
   current: {},  — 当前路由对象
   cb: fn,
   errorCbs: [],
   router: {}
}

当前路由对象的信息:
current = {
     fullPath: ‘/home’,
     name: ‘home’,
     path: ‘/home’
     hash: ‘’,
     matched: [],
     meta: {}. // 在路由中定义的字段
     params: {},  // 路由跳转前自定义的属性
     query: {}    // 路由跳转前自定义的属性
}
有用的信息是current里面的params.   query里面带的自定义属性

current和beforeRouteEnter(to, from, next)里面的to,from对象的字段是一样的

本文地址:https://blog.csdn.net/tangxiujiang/article/details/109697460

相关标签: app 物理返回键