Vue基础（四）-- Vue key 的作用 和路由

一、key的作用
总结：Key 的作用主要是为了高晓的更新虚拟 dom
没有加 key ，diff 默认算法的问题 （虚拟 dom）

1. 如果节点类型不同，直接干掉前面所有的结点，再创建并插入新的节点，不会再比较这个节点以后的子节点
2. 如果节点类型相同，则会重新设置节点的属性，从而实现节点的更新

要使用 Key 来给每一个节点做一个唯一表示，diff 算法就可以正确的识别此节点，找到正确的位置插入新的节点

二、路由的跳转方式
一般有两种：

1、 router- link 标签会渲染为 标签
2、另编程式导航，也就是通过 js 跳转 比如 router.push(‘/home’)

• router -link
• this.$router.xx

•  	push : 			history 添加一个记录
  

•  	replace()      history   不会记录上
  

•  	go()				==> 正整数   或者   负数
  

三、$route 和 $router 的区别？

$router 为vueRouter 的实例，相当于一个全局路由对象，里面含有很多属性和子对象
$route 相当于当前正在跳转的路由对象

四、怎么定义vue-router 的动态路由？怎么获取传过来的动态参数

1、在 router 目录上的 index.js 文件中，对 path 属性加上 /:id
2、使用 router 对象的 params.id

五、vue-router 有哪几种导航狗子
三种：
1、全局导航钩子

beforeEach((to,from,next)=>{
})
afterEach((to,from)=>{
})

// to：即将要进入的目标路由对象
from: 当前导航正要离开的路由
next() ：如果一切正常，则调用这个方法进入下一个钩子
next(false): 去掉导航
next('.login'): 转到对应的路由
next(error)  ：执行一个error 实例

2、路由配置中的导航钩子

beforeEnter((to,from,next)=>{
})

3、组件的钩子函数

beforeRouterEnter
beforeRouterUpdate
beforeRouteLeave