vue页面跳转，$route 无法被监听

Question

vue项目，从a路由跳转到b路由，在b路由对应的页面中监听$route，但是根本不会进断点？

a路由、b路由为两个不同的页面，路径也不同

b页面监听代码如下：

  watch: {
    '$route': {
      handler(to,from){
        debugger
        
      },
      deep: true
    }
  },

问题出在哪儿呢？

Answer 1

这是正常的，从a路由跳转到b路由不会触发监听。你可以使用路由前置钩子或者加个immediate属性

Answer 2

这个问题有人提过了：
https://segmentfault.com/q/1010000009423412

---

可以使用路由前置钩子，但和immediate没有关系

Answer 3

$route 是 vue-router 挂载到 Vue.prototype 上的一个属性，而且只有 get 没有 set ，根本不能触发 watch

  Object.defineProperty(Vue.prototype, '$route', {
    get () { return this._routerRoot._route }
  })

而且是先有路由变化 routerView 去重新渲染组件 a / b ，路由变化的前后过程也不在组件存在的周期内

Answer 4

可以用路由守卫在单个页面或者在router.js都行