场景: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)