vue框架keepAlive缓存的坑

页面跳转顺序index=>detail2=>detail3（三个页面不是单独请求数据，后两个页面是第一个页面数据的传递）

detail2页面与methods同级：

beforeRouteLeave(to,from,next){

      console.log(0)

        if(to.name==='detail3'){

           from.meta.keepAlive = true

           next()

        }else{

           to.meta.keepAlive = false

           from.meta.keepAlive = false

           this.$destroy()

           next()

        }

    },

index页面created增加是否是首次进入的判断：

let isRefresh = sessionStorage.getItem('isRefresh');

    if(isRefresh == '1'){

      sessionStorage.setItem('isRefresh',null);

        window.location.reload();

      } else {

        sessionStorage.setItem('isRefresh',1);

    }

有个问题就是第一个页面需要被刷新，若进行了某种操作时效果不佳，还没被解决

==============================================

2020-06-20更新解决上述问题之第一个页面是选项卡的操作，从index==1时进入二级页面再返回时首页仍是index==1：这样解不如决建议一开始使用二级路由，可能更优雅

拿到并监听选项卡的index值：

watch:{

      active(val){

        console.log(val)

        window.localStorage.setItem("curPage",JSON.stringify(val))

      }

    },

    created:function(){

      let curPage = JSON.parse(localStorage.getItem('curPage'))

      this.active = curPage

      this.mobile = until.mobile

      let isRefresh = sessionStorage.getItem('isRefresh');

      if(isRefresh == '1'){

        sessionStorage.setItem('isRefresh',null);

          window.location.reload();

        } else {

          sessionStorage.setItem('isRefresh',1);

      }

    },