vue-router学习笔记

1.路由基础配置 

https://router.vuejs.org/zh/guide/

2.动态路由

1. 根据设置的路径参数实现 const routes = [ // 动态字段以冒号开始 { path: '/users/:id', component: User }, ]。
2. 需要注意的是参数改变时（第一次访问该路径后，第二次起），组件实例被重复使用，会导致vue的生命周期钩子不生效。可使用watch检测路径的参数：

const User = {
  template: '...',
  created() {
    this.$watch(
      () => this.$route.params,
      (toParams, previousParams) => {
        // 对路由变化做出响应...
      }
    )
  },
}

　　通过配置beforeRouteUpdate导航守卫亦可。

　　3.捕获所有路由或 404 Not found 路由：

const routes = [
  // 将匹配所有内容并将其放在 `$route.params.pathMatch` 下
  { path: '/:pathMatch(.*)*', name: 'NotFound', component: NotFound },
  // 将匹配以 `/user-` 开头的所有内容，并将其放在 `$route.params.afterUser` 下
  { path: '/user-:afterUser(.*)', component: UserGeneric },
]