공부/Vue.js
[Vue.js] 영화 검색 사이트 예제 - 31. 404 Page Not Found
도리암
2022. 4. 7. 16:13
참조) Dynamic Route Matching with Params | Vue Router (vuejs.org)
Dynamic Route Matching with Params | Vue Router
Dynamic Route Matching with Params Very often we will need to map routes with the given pattern to the same component. For example we may have a User component which should be rendered for all users but with different user IDs. In Vue Router we can use a d
router.vuejs.org
Vue Router 문서를 살펴보면, Dynamic Route Matching with Params 부분에 Catch All을 확인할 수 있다.
일반적으로 params는 지정된 페이지만을 매치시키는데, 위의 방법을 사용하면 모든 URL을 캐치한다.
이미 제공된 페이지 외에 다른 값이 들어오게 되면 지정해뒀던 페이지(위에서는 NotFound)를 제공한다.
페이지 제작
/src/routes/NotFound.vue 생성 후 /src/routes/index.js에 항목 추가
여기서 pathMatch는 다른 이름을 사용해도 무관하다.
결과
페이지 구성하기
결과
