为什么在vue3中接收到路由参数?
用了query和param传都不行都是为空,难道不是这样接收的吗https://router.vuejs.org/zh/guide/essentials/passing-props.html
// pageAconst add = (record:any) => {
router.push({ path: "/pageB", params: { id: 123 } })
}
// pageB
import { useRoute } from "vue-router"
const router = useRoute()
onMounted(() => {
console.log(router.params.id) // 为空
})
回答:
试试这样,path
可能不能和params
一起用,文档
router.push({ path: "/pageA/123" })// 或者
router.push({ name: componentA, params: { id: 123 } })
回答:
回答:
path
跳转的方式不能用 params
传递,所以你直接拼接在正确的动态路由位置就好了,比如说这样跳转:
const add = (record:any) => {- router.push({ path: "/pageB", params: { id: record.id } })
+ router.push({ path: "/pageB/" + record.id})
}
而且最近 vue-router 4.1.4+
是做了一个功能的,没有显示声明的 params
参数会被丢弃,具体参看这篇 更新日志。之前有一个其他问题遇到了这个情况 vue3中params跳转到的页面拿不到params的值?
本文参与了SegmentFault 思否面试闯关挑战赛,欢迎正在阅读的你也加入。
回答:
// pageA
const add = (record:any) => {
router.push({ path: "/pageB", query: { id: 123 } })
}
// pageB
import { useRoute } from "vue-router"
const router = useRoute()
onMounted(() => {
console.log(router.query.id)
})
以上是 为什么在vue3中接收到路由参数? 的全部内容, 来源链接: utcz.com/p/933831.html