vue router(2)_404, 중첩 라우팅

NotFound route 설정하기

동적으로 라우트를 설정할 때 잘못된 경로로 중첩이 들어갈 경우 정규식을 사용해서 무엇이든 일치시킬 수 있다.

{
    path: "/:catchAll(.*)",
    // 함수로 보이지만 정규식 패턴임
    // 잡히지 않는 모든 경로를 포함한다는
    name: "NotFoundPage",
    component: NotFoundPage,
},

{ 
  path: '/:pathMatch(.*)*', 
  name: 'NotFound', 
  component: NotFoundView 
},

---

Nested 사용 방법

---

router.replace

예시)

<li class="nav-item">
  <router-link
    :to="{ name: 'NestedOne', replace: true }"
    >Nested One</router-link
  >
</li>

router.push메소드에 replace: true 속성을 추가하여 동작한다.
replace: true로 설정할 경우 해당 route는 현재 항목을 대체하는 용도로 쓰인다.

[router.replace & router.push와 차이점]
서로 같은 역할을 하지만 router.replace는 새로운 히스토리 항목에 추가하지 않고 탐색한다.

https://v3.router.vuejs.org/kr/api/#router-link