Vue는 라우팅 갈고리 차단기 beforeEach 및 afterEach를 사용하여 라우팅을 감청합니다.

루트가 점프할 때, 우리는 약간의 권한 판단이나 다른 조작이 필요하다.이럴 때는 루트의 갈고리 함수를 사용해야 한다.
정의: 루트 갈고리는 주로 사용자가 루트가 변화할 때 특수한 처리를 하여 정의하는 함수입니다.
전체적으로 말하자면 vue에는 세 가지 종류의 갈고리가 제공되었다. 두 가지 함수 1, 전역 갈고리 2, 어떤 루트의 갈고리 3, 구성 요소 내의 갈고리
두 함수:
1. router.beforeEach(function (to, form, next) {})/* 점프하기 전에 실행*/
2. router.afterEach (function (to, form)} {})/* 점프 후 판단 */
전역 갈고리 함수
말 그대로 그것은 전체 국면에 효과적인 함수이다

// router.jsconst router = new Router({
 routes: [
  {
   path: '/',
   name: 'sideBar',
   component: sideBar,
   children:[
    {
     path:'/',
     name:'sort',
     component:sort
    },
    {
     path:'/addNewSort',
     name:'addNewSort',
     component:addNewSort
    },
    {
     path:'/notSend',
     name:'notSend',
     component:notSend
    },
    {
     path:'/sended',
     name:'sended',
     component:sended
    },
  }
 ]
})

router.beforeEach((to,from,next)=>{
 // console.log("to:",to);   // router 
 // console.log("from:",from); //  
 // console.log("next:",next); // Function, , ,  confirmed ( ); false, 。
 if(to.name=='notSend'){
  next({
   name:'sort'
  })
  return
 }
 next()
})

export default router
어떤 루트의 갈고리 함수
말 그대로 어떤 루트에 쓰인 함수로 본질적으로 구성 요소 내 함수와 차이가 없다.

// router.jsconst router = new VueRouter({
 routes: [
  {
   path: '/login',
   component: Login,
   beforeEnter: (to, from, next) => {
    // ...
   },
   beforeLeave: (to, from, next) => {
    // ...
   }
  }
 ]
})
라우팅 어셈블리의 갈고리
라우팅 어셈블리 내에서 다음 라우팅 탐색 갈고리를 직접 정의할 수 있습니다.

// *.vuebeforeRouteEnter
beforeRouteUpdate (2.2  )
beforeRouteLeave
여기서 간단하게 말하자면 갈고리 함수의 용법: 이것은 데이터,methods와 같은 등급이다.

beforeRouteLeave(to, from, next) {
  next()
},
beforeRouteEnter(to, from, next) {
  next()
},
beforeRouteUpdate(to, from, next) { //  
  next()
},
data:{},
method: {}
이상은 본문의 전체 내용입니다. 여러분의 학습에 도움이 되고 저희를 많이 응원해 주십시오.

좋은 웹페이지 즐겨찾기