• vue


    虽然加班,最近心情还是可以的,没多少bug找上门。

    乐级生悲,遇到了个奇葩的坑,花了点时间百度才解决。。。但我离不开的‘板砖’是安卓的,对此坑是抗拒的,完全没问题。。。

    #此坑描述

    ...订单详情某按钮点击,通过window.location.href跳转到(外部)第三方链接后,回退后,在ios中生命周期和路由导航钩子都失效了,无法触发。
    ...在安卓中无视此坑, 回退没有问题

    #解决

    解决方案原因:根据强大的度娘,大概了解此问题可能是因为缓存造成的,所以页面生命钩子,路由钩子没有触发

    解决方案提供:onpageshow事件。 在用户浏览网页时触发       

             onpageshow 事件类似onload事件;

                             onload 事件在页面第一次加载时触发;

                             onpageshow 事件在每次加载页面时触发,即 onload 事件在页面从浏览器缓存中读取时不触发;

    解决方案验证:找了几个ios机,一切ok

    created () {
        window.addEventListener('pageshow', () => {
            //回退到vue应用执行的操作
        })
    }

    #例子

    注:组件销毁时最好销毁pageShow事件,避免消耗

     created() {
        //处理跳转外部链接后,ios回退标题不改变问题
        if (this.$store.state.isIOS) {
          window.addEventListener('pageshow', this.setNav)
        }
      },
     beforeDestroy(){
        if (this.$store.state.isIOS) {
          window.removeEventListener('pageshow', this.setNav)
        }
      },
      methods:{
         // 设置标题
        setNav(){
          console.log('aaaaaaa----');
          window.$native.setNavTitle('订单详情', '', '')
          console.log('bbbbbbbbbbb');
        },
        
      }
     
  • 相关阅读:
    .NET实现图片切割效果(带拖放、缩放效果)
    合成艺术字二 :使用的透明类以及所用的颜色选择器JS(完整事列源码)
    Ajax.net中的Web服务
    IE6和IE7共存方法 (转)
    sql取不重复多字段
    CSS完美兼容IE6/IE7/FF的通用方法
    发布事件.net框架程序设计
    const和readonly
    CSS网站实用技巧:wordwrap同wordbreak的区别
    FCKeditor 2.1.1在ASP.NET中的设置和使用(转)
  • 原文地址:https://www.cnblogs.com/lingXie/p/13055595.html
Copyright © 2020-2023  润新知