Javascript Vue路由器向动态路由传递道具,文档不清楚
我有一个Javascript Vue路由器向动态路由传递道具,文档不清楚,javascript,vue.js,vuejs2,vue-router,Javascript,Vue.js,Vuejs2,Vue Router,我有一个ProjectCard组件,其中链接到特定的ProjectPage组件。ProjectPage将包含一系列不同的段落、图片等,与我的问题并不完全相关 如何将道具传递给项目页面?布尔模式的部分非常模糊,没有告诉我任何有用的东西 我的路由器index.js文件具有他们在文档中提到的特性 从“@/views/ProjectPage.vue”导入项目页面 常数路由=[ { 路径:“projects/:id”, 组件:ProjectPage, 道具:真的 } 为了进行测试,我使ProjectPa
ProjectCard
组件,其中链接到特定的ProjectPage
组件。ProjectPage将包含一系列不同的段落、图片等,与我的问题并不完全相关
如何将道具传递给项目页面
?布尔模式的部分非常模糊,没有告诉我任何有用的东西
我的路由器index.js
文件具有他们在文档中提到的特性
从“@/views/ProjectPage.vue”导入项目页面
常数路由=[
{
路径:“projects/:id”,
组件:ProjectPage,
道具:真的
}
为了进行测试,我使ProjectPage.vue
组件如下所示
静态文本,后跟{{testString}
导出默认值{
名称:“项目页面”,
道具:{
testString:String
}
};
我尝试从我的ProjectCard
组件向它传递一个测试字符串,如下所示:
导出默认值{
名称:“项目卡”,
道具:{
url:String
}
};
这将正确地将我带到指定的路由,例如projects/table
。但是,{testString}
不会呈现,我只能看到静态文本,后面是组件的一部分。控制台中没有错误或警告
在Vue调试器中检查ProjectCard
组件时,testString
嵌套在to/params/testString
下:
但是,在任何ProjectPage
组件上,testString
是undefined
我做错了什么?这个呢
从“@/views/ProjectPage.vue”导入项目页面
常数路由=[
{
名称:'项目',
路径:“projects/:id”,
组件:ProjectPage,
道具:真的
}
及
如前所述
如果提供了路径,则会忽略参数,而对于查询来说,情况并非如此,如上面的示例所示
const userId='123'
router.push({name:'user',params:{userId}})/->/user/123
router.push({path:`/user/${userId}`})/->/user/123
//这行不通
router.push({path:'/user',params:{userId}})/->/user
同样的规则适用于路由器链接
组件的to
属性
我还没意识到我可以在参数中传递id,谢谢你的文档链接!