watch一个路由对象this.$route

例子1：

https://github.com/PanJiaChen/vue-element-admin/blob/master/src/views/login/index.vue

 watch: {
    $route: {
      handler: function(route) {
        const query = route.query
        if (query) {
          this.redirect = query.redirect //
          //
          //
          this.otherQuery = this.getOtherQuery(query)
        }
      },
      immediate: true
    }
  },

上面的代码中，query是vue router的路由对象属性，redirect 是路由的重定向属性，为 vud-element-admin 的路由配置项:“在面包屑中点击会重定向去的地址”。

Vue-element-admin 官方文档中，panjiachen对上述代码的解说

在用 spa(单页面应用) 这种开发模式的之前，用户每次点击侧边栏都会重新请求这个页面，用户渐渐养成了点击侧边栏当前路由来刷新 view 的习惯。但现在 spa 就不一样了，用户点击当前高亮的路由并不会刷新 view，因为 vue-router 会拦截你的路由，它判断你的 url 并没有任何变化，所以它不会触发任何钩子或者是 view 的变化。
…
我本人在公司项目中，现在采取的方案是判断当前点击的菜单路由和当前的路由是否一致，但一致的时候，会先跳转到一个专门 Redirect 的页面，它会将路由重定向到我想去的页面，这样就起到了刷新的效果了。

例子2：

https://github.com/geektime-geekbang/geektime-vue-1/blob/master/router-demo/src/components/RouterChildrenDemo.vue

<template>
  <div>
    {{routerInfo}}
  </div>
</template>
<script>
export default {
  computed: {
    routerInfo() {
      const { fullPath, path, name, params, query, meta } = this.$route
      return {
			fullPath, path, name, params, query, meta
      }
    }
  }
}
</script>

官方参考
https://router.vuejs.org/zh/api/#路由对象属性
https://router.vuejs.org/zh/api/#注入的属性

this.$route
当前**的路由信息对象。这个属性是只读的，里面的属性是 immutable (不可变) 的，不过你可以 watch (监测变化) 它。