路由獨享-組件內守衛

路由獨享寫法:
import VueRouter from 'vue-router'
Vue.use(VueRoter)
const router = new VueRouter({
    routes:[
        {path:component:,name:,beforeEnter:((to,next,from)=>{
            alert('路由獨享-組件內守衛')
            next()//跳轉
            next(false)//不顯示此路由下的組件
        })}
    ],
    mode:'history',
})
組件內守衛:在組件內寫
export defalut{
    data(){
        return {
            name:'tom'
        }
    },
    beforeRouteEnter((to,from,next)=>{
        //beforeRouteEnter 守衛 不能 訪問 this,由於守衛在導航確認前被調用,所以即將登場的新組件還沒被建立。
        //能夠經過next()回調函數得到組件實例
        next(vm=>{
            vm.name
        })

   })
}
相關文章
相關標籤/搜索