一般处理组件中路由器参数的方式采用$router传值
export default {
methods: {
getRouteParamsId() {
return this.$route.params.id
}
}
}
接受路由参数
export default {
mounted(): {
thid.$route.params.id
}
}
但是这样在组件内部使用 $route 会对某个URL产生强耦合，这限制了组件的灵活性。
正确的解决方案是向路由器添加props。
const router = new VueRouter({
routes: [{
path: '/:id',
component: Component,
props: true
}]
})
这样，组件可以直接从props获取 params。
export default {
props: ['id'],
methods: {
getParamsId() {
return this.id
}
}
}
网友评论