通常咱们在vue工程中进行页面跳转,直接用this.$router.push({path:'/xxx ', query: { id: id,name: "yyy"}})vue
可是当跳转的路径相同,只有后面携带的参数不一样时,每每会出现跳转不生效的状况。缓存
那么每每咱们会在进入这个页面的时候调用init()方法,可是不是全部状况均可以用这种方式作的,咱们能够经过监听路由的方式处理。this
watch: { '$route' (to, from) { this.$router.go(0); } }
参考资料:https://blog.csdn.net/wulala_orz/article/details/78928524spa
实际应用实例:.net
背景:一个页面,可是有两个路由指向这个页面,须要这两个路由切换时页面数据刷新code
使用watch监听router变化router
watch: { '$route' (to, from) { if(to.path.indexOf('/materiel-manage/gz')>=0){ this.init(); } if(to.path.indexOf('/materiel-manage/source')>=0){ this.init(); } } }
存在的问题:全部进入这个页面时,数据有会刷新;blog
但愿能作到:当两个路由指向同一个页面时,页面都能缓存,即我在这个路由下操做着页面,跳转到另外一个路由所指向的相同的页面中进行操做,二者不相互干扰。(若是使用keepalive,二者是会被干扰的)路由
望指教,后续找到方式也会不断更新string
在路由跳转,页面刷新这方面还有不少其余的问题,后续遇到,持续更新。