vue.router는 단일 페이지 애플리케이션 구축을 케이크 조각으로 만들어주는 공식 라우팅 플러그인입니다. Vue의 단일 페이지 애플리케이션은 라우팅 및 구성 요소를 기반으로 합니다. 라우팅은 vue-router 단일 페이지 애플리케이션에서 경로 및 구성 요소를 매핑하는 데 사용되며, 페이지 전환 및 점프를 달성하는 데 사용할 수 있습니다.
【관련 기사 추천: vue.js】
vue.router의 기능:
vue-router는 Vue.js의 공식 라우팅 플러그인이며 Vue.js와 긴밀하게 통합되어 있습니다. vue.js - 단일 페이지 애플리케이션 구축에 적합합니다. Vue의 단일 페이지 애플리케이션은 라우팅 및 구성 요소를 기반으로 합니다. 라우팅은 액세스 경로를 설정하고 경로 및 구성 요소를 매핑하는 데 사용됩니다. 기존 페이지 애플리케이션은 일부 하이퍼링크를 사용하여 페이지 전환 및 점프를 구현합니다. vue-router 단일 페이지 애플리케이션에서는 경로 간 전환, 즉 구성 요소 전환이 이루어집니다.
vue-router 구현 원칙
SPA(단일 페이지 애플리케이션): 단일 페이지 애플리케이션에는 전체 페이지가 하나만 있습니다. 페이지를 로드할 때 전체 페이지를 로드하지 않고 지정된 컨테이너 콘텐츠만 업데이트합니다. 단일 페이지 애플리케이션(SPA)의 핵심 중 하나는 페이지를 다시 요청하지 않고 뷰를 업데이트하는 것입니다. vue-router는 단일 페이지 프런트엔드 라우팅을 구현할 때 해시 모드와 기록 모드
1라는 두 가지 방법을 제공합니다. 해시 모드 :
vue-router 기본 해시 모드 - URL 해시를 사용하여 전체 URL을 시뮬레이션하므로 URL이 변경되면 페이지가 다시 로드되지 않습니다. 해시(#)는 웹페이지 내 위치를 나타내는 URL의 앵커 포인트입니다. # 뒤의 부분만 변경하면 브라우저는 해당 위치로만 스크롤하고 웹페이지를 다시 로드하지 않습니다. , #은 브라우징을 안내하는 데 사용됩니다. 서버 측에서는 전혀 쓸모가 없으며 동시에 HTTP 요청에는 # 이후의 부분이 변경될 때마다 브라우저의 액세스 기록에 기록이 추가됩니다. . 이전 위치로 돌아가려면 "뒤로" 버튼을 사용하세요. 그러면 해시 모드는 앵커 포인트 값 변경을 통해 다른 값에 따라 지정된 DOM 위치에 다른 데이터를 렌더링합니다.
해시 모드는 URL에 자체 #을 가지므로 보기 흉한 해시를 원하지 않으면 라우팅 규칙을 구성할 때 "mode: 'history'"만 추가하면 됩니다. . 이 모드는 페이지를 다시 로드할 필요 없이 URL 점프를 완료하기 위해 History.pushState API를 최대한 활용합니다.
는 Vue.js의 공식 라우팅 플러그인으로 vue.js와 긴밀하게 통합되어 있으며 단일 페이지 애플리케이션을 구축하는 데 적합하므로 단일 페이지 애플리케이션을 쉽게 구축할 수 있습니다. 포함된 기능은 다음과 같습니다:
vue-router
관련 학습 권장 사항:
javascript 학습 튜토리얼위 내용은 vue.router의 용도는 무엇인가요?의 상세 내용입니다. 자세한 내용은 PHP 중국어 웹사이트의 기타 관련 기사를 참조하세요!