使用 vue.js,如何设置带有嵌入式 children 的动态 router-link?
With vue.js, how can I set up a dynamic router-link with embedded children?
我的 router.js
有一些嵌入式 children:
routes: [{
path: '/',
name: 'login',
component: Login,
},
{
path: '/app',
component: Container,
children: [{
path: '',
name: 'ConversationsList',
component: ConversationsList
}, {
path: 'call',
name: 'Call',
component: Call
}, {
path: 'conversation/:id',
name: 'ConversationDetail',
component: ConversationDetail,
children: [{
path: '',
name: 'ConversationDetailHighlights',
component: ConversationDetailHighlights
}, {
path: 'transcript',
name: 'ConversationDetailFullTranscript',
component: ConversationDetailFullTranscript
}]
}]
},
],
我当前的路线是 /app/conversation/:id
,我希望我的模板有 link 到 /app/conversation/:id/transcript
。我如何使用 vue.js 完成此操作?
如果我正确理解问题,应该这样做:
<router-link
:to="{
name: 'ConversationDetailFullTranscript',
params: {
id: 'some-id'
}
}">
View full transcript
</router-link>
我的 router.js
有一些嵌入式 children:
routes: [{
path: '/',
name: 'login',
component: Login,
},
{
path: '/app',
component: Container,
children: [{
path: '',
name: 'ConversationsList',
component: ConversationsList
}, {
path: 'call',
name: 'Call',
component: Call
}, {
path: 'conversation/:id',
name: 'ConversationDetail',
component: ConversationDetail,
children: [{
path: '',
name: 'ConversationDetailHighlights',
component: ConversationDetailHighlights
}, {
path: 'transcript',
name: 'ConversationDetailFullTranscript',
component: ConversationDetailFullTranscript
}]
}]
},
],
我当前的路线是 /app/conversation/:id
,我希望我的模板有 link 到 /app/conversation/:id/transcript
。我如何使用 vue.js 完成此操作?
如果我正确理解问题,应该这样做:
<router-link
:to="{
name: 'ConversationDetailFullTranscript',
params: {
id: 'some-id'
}
}">
View full transcript
</router-link>