programing

Vue 라우터의 정확한 경로 일치?

shortcode 2022. 8. 23. 21:31
반응형

Vue 라우터의 정확한 경로 일치?

Vue 어플리케이션에서 작업하고 있는데 디폴트루트에 대해 정확한 경로 일치를 설정하려고 합니다.나는 리액트와 앵글에 경험이 있고 둘 다 옵션을 주었다.exact그리고.pathMatch:'full'따라서 디폴트루트는 정확히 일치하는 경우에만 활성화됩니다.

vue에서는 앱을 새로 고치면 기본 경로가 실행되어 사용자가 첫 페이지로 돌아갑니다.Vue에서 그런 거 할 수 있는 방법이 있나요?

  routes: [
    {
      path: "/",
      name: "home",
      component: Home
      // how can I add exact match config here?
    },
    {
      path: "/login",
      name: "login",
      component: () =>
        import(/* webpackChunkName: "about" */ "./views/Login.vue")
    },
    {
      path: "/charts",
      name: "charts",
      component: () =>
        import(/* webpackChunkName: "about" */ "./views/ChartDemo.vue")
    }
  ]

Vue-router 루트의 순서는 중요하므로 루트를 이 순서로 정렬해 보십시오.매칭은 위에서부터 시작합니다.

  routes: [
    {
      path: "/login",
      name: "login",
      component: () =>
        import(/* webpackChunkName: "about" */ "./views/Login.vue")
    },
    {
      path: "/charts",
      name: "charts",
      component: () =>
        import(/* webpackChunkName: "about" */ "./views/ChartDemo.vue")
    },
    {
      path: "/",
      name: "home",
      component: Home
      // how can I add exact match config here?
    }
  ]

오래된 질문인 건 알지만, 다른 누군가가 혜택을 볼 수 있을지도 몰라요.

Vue Router는 기본적으로 정확한 일치를 사용하는 것 같습니다.예를 들어, 이와 같은 것이 있는데, "정확한" 키워드나 이와 유사한 키워드를 사용하지 않고 특정 컴포넌트를 엽니다.

  {
    name: 'Mailbox',
    path: '/mailbox',
    component: Mailbox
  },
  {
    name: 'Message',
    path: '/mailbox/:messageId',
    component: Message
  }

또, 이 메뉴얼에서는, 아스타리스크를 사용해 소정의 패스로 시작하는 모든 루트를 대조하는 방법에 대해서도 설명하고 있습니다.그러면 이것이 Vue Router의 기본 동작이 아니라고 가정할 수 있습니다.

언급URL : https://stackoverflow.com/questions/57356077/exact-path-match-in-vue-router

반응형