本文摘自PHP中文网,作者coldplay.xixi,侵删。
vue.js监听路由变化的方法:1、通过watch实现,代码为【watch:{$route(to,from){console.log(to.path);}】;2、key是用来阻止“复用”的,代码为【<router-view :key= 】。
本教程操作环境:windows10系统、vue2.9,本文适用于所有品牌的电脑。
【相关文章推荐:vue.js】
vue.js监听路由变化的方法:
方法一:通过 watch
1 2 3 4 5 6 |
|
或
1 2 3 4 5 6 7 8 9 10 |
|
或
1 2 3 4 5 6 7 8 9 |
|
方法二:key是用来阻止“复用”的
Vue 为你提供了一种方式来声明“这两个元素是完全独立的――不要复用它们”。只需添加一个具有唯一值的 key 属性即可(Vue文档原话)
1 2 3 4 5 6 7 |
|
使用computed属性和Date()
可以保证每一次的key都是不同的,这样就可以如愿刷新数据了。
方法三:通过 vue-router 的钩子函数 beforeRouteEnter beforeRouteUpdate beforeRouteLeave
相关阅读 >>
更多相关阅读请进入《vue.js》频道 >>

Vue.js 设计与实现 基于Vue.js 3 深入解析Vue.js 设计细节
本书对 Vue.js 3 技术细节的分析非常可靠,对于需要深入理解 Vue.js 3 的用户会有很大的帮助。——尤雨溪,Vue.js作者