我是 VueJS 和前端开发的新手。
我希望将一个 props(在本例中是我的俱乐部的 id)传递给我的组件/视图。
它最初是与<router-link :to="{ name: 'club', params: {id: club.id } }">
。
我的组件调用 props“id”,而我的视图名为 Club,其参数 props:true;
快进一会儿,我必须添加命名视图。 (我现在只添加了一个 - 但我将有一个视图内容和一个导航)。
mode: 'history',
base: process.env.BASE_URL,
linkExactActiveClass: 'is-active',
routes: [
{
path: '/',
name: 'clubs',
components: {
content: Clubs
}
},
{
path: '/club/:id',
name: 'club',
props: true,
components: {
content: Club
}
}
]
})
这打破了一切。
在 Vue 扩展中,我可以看到我的 send 将我的 props 作为参数发送(参见附件 1),但是一旦进入视图,id 就未定义(参见附件 2)。
我错过了什么吗?
Attachement 1
![Router Link Router Link](https://forum.vuejs.org/uploads/default/optimized/3X/a/1/a19879ad9af1eadc7c0aa88bf89f00114431b230_2_1380x416.png)
Attachement 2
![View Data View Data](https://forum.vuejs.org/uploads/default/optimized/3X/8/4/8491963d8fea3b8d8f3c4b42ca9774f6c1cf5374_2_1380x240.png)
你需要设置一个props
在这种情况下每个命名视图的值。例如
components: {
content: Club
},
props: {
content: true
}
我在文档中找不到对此的合理解释,但它确实在此处的示例中有所体现:
https://router.vuejs.org/guide/essentials/passing-props.html https://router.vuejs.org/guide/essentials/passing-props.html
请注意代码示例中隐藏的以下注释:
// for routes with named views, you have to define the `props` option for each named view:
本文内容由网友自发贡献,版权归原作者所有,本站不承担相应法律责任。如您发现有涉嫌抄袭侵权的内容,请联系:hwhale#tublm.com(使用前将#替换为@)