이 글은 주로 vue.js와 vue-router를 사용하여 단일 페이지를 생성하는 구현 코드를 공유합니다.
vue.js+vue-router는 단일 페이지 애플리케이션을 생성합니다
1. 설치
npm install vue-router
2. 라우터 애플리케이션
1. 라우팅 정보 객체. : $route (읽기 전용 및 불변, 변경 사항은 watch를 통해 감지 가능)
현재 URL을 구문 분석하여 얻은 정보와 URL과 일치하는 라우팅 기록을 포함하여 현재 활성화된 경로의 상태 정보를 나타냅니다.
The 라우팅 정보 개체가 여러 위치에 나타납니다.
1 . vuex 설치
export default { name: 'app', computed:mapGetters(['loading','shownav']), //监听路由的变化 watch:{ $route(to,from){ console.log(to); console.log(from); } }, components:{ } }
2. 스토어 만들기
Vuex 상태를 저장할 디렉터리도 만듭니다
관련 권장 사항:
Vue.js가 여러 라우팅 영역이 있는 단일 페이지를 작동하는 방법에 대한 사례 연구H5 단일 페이지 제스처 슬라이딩 화면 전환 원리webpack, vue, node는 단일 페이지 코드 공유를 실현위 내용은 vue.js, vue-router는 단일 페이지 애플리케이션 구현 코드를 생성합니다.의 상세 내용입니다. 자세한 내용은 PHP 중국어 웹사이트의 기타 관련 기사를 참조하세요!