点击跳转详情页的时候。路由改变,页面不刷新,也不触发created 事件 。

44 篇文章 0 订阅
30 篇文章 0 订阅

问题 :点击跳转详情页的时候。路由改变,页面不刷新,也不触发created 事件 。
原因 :页面有缓存。
解决方案 :
1: 在路由出口处,加上唯一的key属性做为路由的id

<keep-alive>
<router-view :key="$route.fullPath"> </router-view>
<keep-alive>

我们配置了动态路由,并且给每个标题传了不同的id值 通过$route.fullpath就可以拿到传过去的id
2:watch 监听
为了使切换页面时编辑的数据仍然保留,所以对页面做了缓存(页面路由的keepAlive:true)。但是路由参数有变化时页面用的仍然是缓存的数据并没有刷新。
所以监听路由参数id,有变化则重新获取数据

watch: {
    $route(){
        if(this.$route.path=='/aSale_workOrderCreate' && this.$route.query.id){
              var newid = this.$route.query.id;//当前页新id
              var oldid = sessionStorage.getItem('oldRoute');//旧的id
 
              if(oldid!=newid){//id有变化时
                   sessionStorage.setItem('oldRoute',this.$route.query.id);
                   this.orderid = this.$route.query.id;
                   //监听到id有变化时 执行你想要的操作
                    
              }
         }
     }
},
 
mounted:function(){
     if(this.$route.query.id){
          this.orderid = this.$route.query.id;
          sessionStorage.setItem('oldRoute',this.$route.query.id);
     }
}
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值