问题:

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项,发现列表内容长一样。

Logo

华为开发者空间,是为全球开发者打造的专属开发空间,汇聚了华为优质开发资源及工具,致力于让每一位开发者拥有一台云主机,基于华为根生态开发、创新。

更多推荐