移动端app、ios系统 刷新事件监听

场景：app发布到钉钉微应用上，钉钉自带导航刷新功能。

　　app特点是组件多层嵌套，比如顶部导航，往往设计是全局的，当进入子界面会隐藏组件。

　　这时触发了刷新功能会导致初始化问题。

处理方式：刷新时回到首页

功能完成特点：获取触发事件，初始化store的全局组件相关设置，返回到首页

下面是介绍如何监听刷新以及ios系统问题

 

在app组件设置

添加methods方法beforeunloadHandler

beforeunloadHandler (e) {
      // e.returnValue = '1'
      // 本地窗口临时保存刷新前的状态数据

　　　　window.localStorage.setItem('reFresh', true)

　　　　　// 保存store状态

    },

 

mounted生命周期设置代码

 window.addEventListener('beforeunload', this.beforeunloadHandler, true)
// 执行store初始化状态

mounted生命周期可以利用本地保存去设置

if (reFresh) {
      this.$router.push('/')
      window.localStorage.setItem('reFresh', false)
      // 加载刷新前的数据
    }

 

beforeunload在ios系统不生效
只需要把beforeunload改为pagehide即可

window.addEventListener('pagehide', this.beforeunloadHandler, true)