vue切换路由不重新渲染_vue中共用一个页面只是路由参数的变化的单页面重新渲染...

遇到问题的需求是：一个列表有好多层，但是列表都长得一样只是对应的不同的层级，所以共用了一个单页面，只是路由上的params的ID在进行变化

问题是：路由变化了，但是页面并没有重新渲染。

刚开始想到的解决方法是在标签上加 :key="Math.random()",但是没有什么效果，跟同事商量了半天也解不了惑，这个属性只在elementUI的table表格上使用过。

第二种，记得vue-router中这个标签上可以添加key属性，即

$route.fullPath完成解析后的 URL，包含查询参数和 hash 的完整路径

只要url进行变化就会重新渲染，但是基于这个页面是后来新增加的，添加全局的这个属性会有所影响，所以抛弃了这一种方法

第三种，在vue-router的官网上看到了数据获取---导航完成后获取数据，通过watch进行监听$route

具体代码实现：

watch: {

// 如果路由有变化，会再次执行该方法

'$route': 'fetchData'

}, methods: {

//fetchData 可以接受两个参数newVal, oldVal

fetchData (newVal, oldVal) { //进行获取数据的操作

}

}

复制代码

第一次写文章，记录自己日常的bug，望大家多多包涵，多多提提意见