vue学习笔记 导航守卫

一、什么是导航守卫

　　　导航守卫就是，监听你从一个路由跳转到另外一个路由 ，有了导航守卫，你就可以在跳转之前或者跳转之后做一些事情

二、全局导航守卫

/ 前置守卫（guard）
router.beforeEach( //监听守卫
    (to, from, next) => {
        //从form跳转到to 
        document.title = to.meta.title //document.title = to.matched[0].meta.title 嵌套路由这里有两种方式，第一种直接拿嵌套路由，第二种拿嵌套路由的父路由
        next()//这里的next是必须调用的

    })
//后置钩子（hook） 后置钩子不需要主动调用next函数(因为此时已经跳转完了，不需要进行后续操作)

router.afterEach((to,form)=>{
    console.log('dasdsdasda')
})
//关于next ，next()进行管道中的下一个钩子，如果全部钩子执行完毕，则导航的状态就是confirmed(确认)
next('./')//或者next({path:'/'})//跳转到一个不同的地址，当前的导航被中断，进行一个新的导航
//要确保使用next方法，否则钩子不会被resolved
//还有路由独享守卫 
//写在路由配置中，只有访问到这个路径，才能触发钩子函数


//组件内的守卫
//写在组件中,访问路径，即将渲染组件的时候触发的

三、路由独享守卫 和全局守卫类似，但是它只在某一个路由中起作用

四、组件内的守卫（等后续更新）

五、类似的，与守卫有着相似功能的还有我们的生命周期函数

　　created mounted updated