vue-router在同一个路由下切换,取不到变化的路由参数
最近用vue写项目的时候碰到一个问题,在同一个页面下跳转,路由地址不变,路由参数有变化,一开始只是在data里取路由的参数,发现根本取不到变化的路由参数。
例如:订单列表也跳转详情页,跳转方法如下
<router-link :to="{path: '/orderDetail', query: {orderId: scope.row.orderId}}"> <el-button type="success" size="small">详情</el-button> </router-link>
第一个跳转没问题,但是返回列表以后,在进入其他的详情页,顶部url的值变化了,但是在详情页中
this.routerId = this.$route.query.orderId;
这样打印出来值是不发生变化的。
解决方案如下:
数据初始化是这样的(不变)
/** * 数据初始化 */ initDate() { this.routerId = this.$route.query.orderId;
加一段代码
watch: { '$route' (to, from) { this.initDate(); } },
这样就能解决了
浩楠哥