问题 :点击跳转详情页的时候。路由改变,页面不刷新,也不触发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);
}
}