全局路由守卫-3个
全局守卫是任何路由执行的时候都要执行的守卫
以下三个都有三个参数
to: Route: 即将要进入的目标 路由对象
from: Route: 当前导航正要离开的路由
next: Function: 一定要调用该next方法（相当于放行），否则路由不向下执行。
三者的执行顺序为：
全局前置守卫beforeEach——>全局解析守卫beforeResolve——>全局后置守卫afterEach
beforeEach全局前置守卫
beforeEach 在初始化 和 每次路由每次切换之前执行，【beforeEach和beforeResolve 两者用法差不多，大多用beforeEach】【可以用于登录拦截】
router.beforeEach((to, from, next) => {
console.log('到哪去to', to);
console.log('从哪来from', from);
console.log('beforeEach全局前置守卫');
next();//一定要加next(),不然没法获取接下来的路由
})
beforeResolve 全局解析守卫
beforeResolve 是在解析页面之前执行【即匹配到了path进而匹配到component之后】
router.beforeResolve((to, from, next) => {
console.log('beforeResolve全局解析守卫');
next();
})
afterEach 全局后置守卫
afterEach 初始化的时候调用，路由切换完毕调用【注意，没有next】
可以适用于切换完路由需要更改页面的对于的title的功能实现
router.afterEach((to, from) => {
console.log('afterEach后置守卫执行了');
})
局部路由守卫/路由独享 beforeEnter -1个
局部路由守卫，只针对某个路由规则生效
它的执行的顺序比beforeEach要晚，但早于beforeResolve， 在解析了路由表，找到了对应的路径，但未进入相应的路由项之前调用
【可以用于部分路由的登录拦截】
{
path:"/cinema",
component:Cinema,
beforeEnter:(to,from,next)=>{//局部路由守卫,只针对某个路由规则生效,参数和全局守卫一致
next()
}
},
组件内守卫-3个
它比全局前置要慢，比路由独享要慢，快于全局解析路由守卫
注意： beforeRouteEnter不能获取组件实例 this，因为当组件守卫执行前，组件实例还没被创建，但是剩下的两个组件内守卫可以
解决：如果想要在beforeRouteEnter中取到this，可以通过在next函数中传一个回调函数，回调函数的形参就是当前页面的实例，如下
可以在路由组件内直接定义以下组件内守卫
beforeRouteEnter
通过路由规则，进入该组件前被调用 【可以用于权限管理】
<script>
export default {
beforeRouteEnter (to, from, next) {
// 在渲染该组件的对应路由被 confirm 前调用
// 不！能！获取组件实例 `this`
// 因为当守卫执行时，组件实例还没被创建
// 在next函数中可以传一个回调函数,回调函数的形参就是当前页面的实例
next((instance) => {
console.log(instance);
});
},
</script>
beforeRouteUpdate 路由更改了，那么就会触发
<script>
export default {
beforeRouteUpdate (to, from, next) {
// 在页面显示时不会触发,在路由改变时会触发
// 可以访问组件实例 `this`
next();
},
}
</script>
beforeRouteLeave
通过路由规则，离开该组件时调用
<script>
export default {
beforeRouteLeave (to, from, next) {
// 导航离开该组件的对应路由时调用
// 可以访问组件实例 `this`
next();
}
}
</script>
执行顺序 (组件内守卫：beforeRouteLeave) ——> beforeEach ——> 局部路由守卫:beforeEnter ——> (组件内守卫:beforeRouteEnter，beforeRouteUpdate) ——> beforeResolve ——> afterEach
路由跳转的执行过程 首先根据声明式导航或者编程式导航拿到目标url ——> 去路由表中遍历path找到目标地址 ——> 进而找到对应的component ——> 找到对应的路由组件去解析渲染
