路由

怎么定义vue-router的动态路由？怎么获取传过来的值？

动态路由的创建，主要是使用path属性过程中，使用动态路径参数，以冒号开头，如下：

{

  path: '/details/:id'

  name: 'Details'

  components: Details

}

访问details目录下的所有文件，如果details/a，details/b等，都会映射到Details组件上。

当匹配到/details下的路由时，参数值会被设置到this.$route.params下，所以通过这个属性可以获取动态参数

this.$route.params.id

vue-router有哪几种路由守卫

路由守卫为：

全局守卫：beforeEach

后置守卫：afterEach

全局解析守卫：beforeResolve

路由独享守卫：beforeEnter

$route和 $router的区别是什么？

$router 为VueRouter的实例，是一个全局路由对象，包含了路由跳转的方法、钩子函数等。

$route 是路由信息对象||跳转的路由对象，每一个路由都会有一个route对象，是一个局部对象，

  包含    path,params,hash,query,fullPath,matched,name等路由信息参数。

vue-router响应路由参数的变化

用watch 检测

watch: {

      $route(to,form){

          console.log(to.path)

      }   

}

组件内导航钩子函数

beforeRouteUpdate(to,form, next){

      console.log(to.path)

}

vue-router 传参

​  (1)使用Params:

  (2)使用Query：