Vuejs 라우터 하위 구성 요소에 대한 링크

Question

현재 라우터에 페이지 구성 요소를 연결하도록 설정되어 있습니다. 이러한 각 페이지 구성 요소에는 예를 들어 하위 구성 요소가 있습니다.

<slider></slider> 
<section></section> 
<section></section> 
<section></section> 
<panel></panel> 

홈 I 홈 페이지 구성 요소의 구성 요소에 연결하고 싶어이 가능 말한다.

그래서 경로는 위의 예에 불과하지만, 내가 무엇을 찾고 이상적이다 http://example.com/home/panel

될 것이다. 어떤 도움이라도 굉장합니다.

const routes = [{ 
    path: '/home', 
    component: Home, 
    children: [{ 
    path: 'panel', 
    component: Panel 
    }] 
}] 

이 그런 다음 Home 구성 요소는 구성 요소까지 제공하는 router-view 태그를 다음과 같습니다 :

Answer 1

당신은 경로의 아이를 정의하여 nested routes을 사용할 수 있습니다 여기에

<router-view></router-view> 

하면 JSFiddle는 다음과 같습니다 https://jsfiddle.net/craig_h_411/srxafk39/