我有一个带有对象“ project_element”的组件,我想通过“ vue-router”将该对象转移到另一个组件。
这是我的第一个组件中的代码,如果用户单击按钮,它将打开第二个组件。
<router-link :to="{ name: 'project', params: { project_url: project_element.project_name, project_element: project_element} }">
<b-button> Open </b-button>
</router-link>
这是我的Vue Router中index.js中的代码
{
path: '/projects/:project_url',
component: SingleProjectViewApp,
name: 'project',
props: { project_element: project_element }
},
我已经设法将“ project_element.project_name”设置为url,但是我在第二个组件中也需要“ project_element”本身。
在组件中,我已在“道具”部分设置了对象
props: {
project_element: {
type: Object,
required: true
}
},
问题出在Vue路由器中,我不能像带变量那样传递project_element,只能带引号。但是然后我得到一个错误,因为显然该组件期望一个对象而不是字符串。
感谢您的帮助!
在路由器中尝试此操作
path: '/projects/:project_url?',
component: SingleProjectViewApp,
props(route) {
const props = {
projectElement: route.params.project_url
};
return props;
}
并且在道具中将“ project_element”更改为“ projectElement”(通常要在vue道具中使用camelCase)