source

Vue-router: Enter 가드가 하위 경로에 대해 제대로 작동하지 않습니다.

goodcode 2022. 10. 6. 21:46
반응형

Vue-router: Enter 가드가 하위 경로에 대해 제대로 작동하지 않습니다.

자녀 경로에 대해 beforeEnter 가드를 정의하려고 하지만 성공하지 못했습니다.루트 설정은 다음과 같습니다.

  ...
  {
    path: '/',
    component: App
    beforeEnter: (to, from, next) ->
       # This block is only reached when I refresh the page

    children: [
      {
        name: 'component1',
        path: '/component1',
        components: component1
      },
      {
        name: 'path2',
        path: '/path2',
        components: component2
      },
     ...
    ]
  }
  ...

페이지를 새로 고치거나 브라우저에 직접 URL을 삽입하면 모든 것이 정상적으로 작동합니다(예: base_path/path2).단, path1 또는 path2로 리다이렉트되는 라우터 링크를 클릭해도 beforeEnter 가드는 실행되지 않습니다.

제가 뭘 잘못 이해했나요?각 아이에 대해 beforeEnter 가드를 설정해야 합니까?

내가 찾은 최고의 솔루션은 각 가드 전에 beforeEnter를 사용하는 것이었어.

beforeEnter는 루트 가드 단위이며 부모 루트에만 적용되며 자녀에게는 적용되지 않습니다.

추가 시도beforeRouteUpdate후크, 즉,

...
{
path: '/',
component: App
beforeEnter: (to, from, next) ->
   # This block is only reached when I refresh the page
beforeRouteUpdate: (to, from, next) ->
   # This will called when you use router-links
children: [
  {
    name: 'component1',
    path: '/component1',
    components: component1
  },
  {
    name: 'path2',
    path: '/path2',
    components: component2
  },
 ...
]
}
...

@sysloglok2010,beforeRouteUpdate컴포넌트의 후크입니다.

언급URL : https://stackoverflow.com/questions/46837819/vue-router-beforeenter-guard-doesn-t-work-properly-for-children-path

반응형