问题:
vue项目中ios某些机型前进后退时页面状态没有更新
解决方案:
需要在当前页面进行一次页面刷新
代码:
update () {
// 根据window.performance.navigation.type 的type值进行判断是否为前进后退访问的形式
if (window.performance?.navigation?.type === 2) {
location.reload()
}
}
涉及到的api介绍:
window.performance
Web Performance API 允许网页访问某些函数来测量网页和 Web 应用程序的性能
performance.navigation(只读属性)
1.返回一个对象
2.这个对象表示出现在当前浏览上下文的 navigation 类型,其中type属性:
(1)一个无符号短整型,表示是如何导航到这个页面的,
(2) 0表示当前页面是通过点击链接,书签和表单提交,或者脚本操作,或者在 url 中直接输入地址
(3)1表示:点击浏览器的刷新页面按钮或者通过Location.reload()方法显示的页面
(4)2表示页面通过历史记录和前进后退访问
(5)其他情况为255
案例一:
在ios中,在页面A进行微信自定义分享设置,发现未生效。
案例二:
列表页有多个tab项,从列表进入详情页,再返回到列表页,点击每个tab项,发现列表内容长一样。