若依 this.$router.push 同地址不同参,页面不刷新问题

简介: 若依 this.$router.push 同地址不同参,页面不刷新问题

背景:若依框架里面默认页面都是缓存的,使用this.$router.push 同地址不同参打开页面时,页面也默认缓存了,导致数据不刷新。


解决办法:


1、打开页面前创建一个标记


sessionStorage.setItem("cgsqmx","Refresh");


2、离开页面时发现有这个标记,然后删若依缓存

beforeRouteLeave (to, from, next) {
  debugger;
    if (to.name === 'Cgsqmx' && sessionStorage.getItem("cgsqmx")==="Refresh") {
      try {
        var cache = this.$vnode.parent.componentInstance.cache;
        var key="";
        for(var prop in cache){
          if(prop.lastIndexOf("cgsqmx")>0){
            key=prop;
          }
        }
        if(key!=""){
          delete cache[key];
        }
      } catch (error) {
      }
      // // console.log('返回管理页面')
      // if (this.$vnode && this.$vnode.data.keepAlive) {
      //   if (this.$vnode.parent && this.$vnode.parent.componentInstance && this.$vnode.parent.componentInstance.cache) {
      //     if (this.$vnode.componentOptions) {
      //       var key = this.$vnode.key == null
      //         ? this.$vnode.componentOptions.Ctor.cid + (this.$vnode.componentOptions.tag ? `::${this.$vnode.componentOptions.tag}` : '')
      //         : this.$vnode.key
      //       var cache = this.$vnode.parent.componentInstance.cache
      //       var keys = this.$vnode.parent.componentInstance.keys
      //       if (cache[key]) {
      //         if (keys.length) {
      //           var index = keys.indexOf(key)
      //           if (index > -1) {
      //             keys.splice(index, 1)
      //           }
      //         }
      //         delete cache["key"]
      //         debugger;
      //       }
      //     }
      //   }
      // }
      this.$destroy()
    }
    next()
  },


3、到达目标页面后,清空标记

sessionStorage.setItem("cgsqmx","");
目录
相关文章
Maximum call stack size exceeded报错的原因及解决办法
Maximum call stack size exceeded报错的原因及解决办法
3954 0
|
SQL 数据库
若依框架---树状层级部门数据库表
若依框架---树状层级部门数据库表
1432 0
|
JavaScript 前端开发
若依框架文档开发手册----开发中常用功能模块(中)
若依框架文档开发手册----开发中常用功能模块
4523 0
|
算法 前端开发 JavaScript
若依框架---数据转树状层级
若依框架---数据转树状层级
977 0
|
JavaScript 数据格式
vue3 + Ant design vue formItem 无法使用嵌套的form表单校验
vue3 + Ant design vue formItem 无法使用嵌套的form表单校验
999 1
|
JavaScript
Vue中给当前页面传递参数并重新加载,vue使用this.$router.push跳转页面,给跳转过去的页面传参不一致时重新加载
Vue中给当前页面传递参数并重新加载,vue使用this.$router.push跳转页面,给跳转过去的页面传参不一致时重新加载
826 0
|
缓存 JavaScript
vue使用keep-alive实现页面前进刷新,后退缓存,完美运行无bug
vue使用keep-alive实现页面前进刷新,后退缓存,完美运行无bug
1590 122
|
JavaScript 开发者
vue解决报错Unable to preventDefault inside passive event listener invocation.
vue解决报错Unable to preventDefault inside passive event listener invocation.
2083 0
|
JavaScript 网络架构
vue 使用 this.$router.push 传参数,接参数的 query或params 两种方法示例
vue 使用 this.$router.push 传参数,接参数的 query或params 两种方法示例
2257 4
this.$router.push点了后hash地址改变了,页面却不跳转
this.$router.push点了后hash地址改变了,页面却不跳转