javascript - vue 구성 요소를 사용하여 동적으로 라우터 링크를 생성하는 방법

Question

으아악

현재 문제

이것도 가능하지만 vue-router가 실행되기 전에 컴포넌트가 등록되지 않았다는 오류가 보고됩니다. 더 좋은 동적 구현 방법이 있는지 묻고 싶습니다

원래 질문↓

위와 같이 side Routing을 동적으로 생성한 후 vue-router를 실행하여 파싱해야 하는데 왜 오류가 발생하는지 모르겠습니다

이유는 VueRouter 인스턴스가 없더라도 vue-router가 자동으로 라우터 링크를 구문 분석하기 때문입니다

Answer 1

1. 우선, Vue.comComponent의 두 번째 매개변수는 구성 객체입니다. 작성 방식이 JS 구문을 준수하지도 않습니다.

2. 두 번째로 템플릿 구성은 HTML 코드 문자열이어야 하므로 다음과 같이 변경합니다.

으아악

업데이트

(참고: https://router.vuejs.org/en/e...)

소개에서 언급하신 상황을 고려하여 코드를 다음과 같이 수정합니다.
먼저 Vue와 Vue-router를 다음 순서로 소개합니다

으아악

그런 다음 다음 JS를 추가하세요

으아악

는 Vue.component()语句了，此时，因为注册了Vue-Router组件，<router-link>를 사용하여 인식할 수 있습니다.