1200字范文,内容丰富有趣,写作的好帮手!
1200字范文 > vue路由守卫 路由拦截 导航守卫

vue路由守卫 路由拦截 导航守卫

时间:2022-04-25 02:37:10

相关推荐

vue路由守卫 路由拦截 导航守卫

路由守卫就是当⻚⾯跳转的时候会触发的钩⼦函数,

vue⼀共给我们提供了三种路由守卫

全局路由守卫

前置守卫:

router.beforeEach((to,from,next) => {})

to-到哪里去 from --从哪里来 next–重定向

//路由拦截 我们经常使⽤路由守卫实现⻚⾯的鉴权router.beforeEach((to,from,next) => {const token = store.state.koten;if(!token && to.name!='Login'){//如果没有token 并且当前页不是登陆页next("/login")//去登陆页{if(token && to.name=="Login"){//如果有token 并且当前页是登陆页next("/")//去首页}next()//如果有token 并且当前页不是登陆页,则继续它的操作}

后置守卫:

router.afterEach((to,from) => {})//!!!!没有next

组件级路由守卫

beforeRouteEnter(to,from,next){}//---路由进入之前beforeRouteUnpdate(to,from,next){}//---路由更新之前(特定的值 组件没变 ---路由变了--动态路由)beforeRouteLeave(to,from,next){}//---路由离开之前

独享守卫

const routes = [{path:"/",name:"Home",component:Home,beforeEnter(to,from,next){console.log(to,from,next)//beforeEnter//---是写在路由配置里边的}}]

本内容不代表本网观点和政治立场,如有侵犯你的权益请联系我们处理。
网友评论
网友评论仅供其表达个人看法,并不表明网站立场。