第一种：是全局导航钩子
包含router.beforeEach(to,from,next)，router.afterEach(to,from,next)，
全局前置守卫：（作用：跳转前进行判断拦截。）
router.beforeEach((to, from, next) => {
// do someting
});
全局后置钩子：（作用：跳转后进行判断拦截。）
router.afterEach((to, from) => {
// do someting
});
组件内的钩子
beforeRouteEnter(to, from, next) {
next (vm => {
// 这里通过 vm 来访问组件实例解决了没有 this 的问题（beforeRouteEnter 不能获取组件实例 this）
})
// do someting // 在渲染该组件的对应路由被 confirm 前调用
},
beforeRouteUpdate(to, from, next) {
// do someting
// 在当前路由改变，但是依然渲染该组件是调用
},
beforeRouteLeave(to, from ,next) {
// do someting
// 导航离开该组件的对应路由时被调用
}
第三种：路由独享的钩子
cont router = new VueRouter({
routes: [
{
path: '/file',
component: File,
beforeEnter: (to, from ,next) => {
// do someting
}
}
]});
