![cover](https://img-blog.csdnimg.cn/d32a4ab9b8044a23b0e2cd6367e61338.png?x-oss-process=image/watermark,type_d3F5LXplbmhlaQ,shadow_50,text_Q1NETiBAbWZ4Y3lo,size_20,color_FFFFFF,t_70,g_se,x_16)
Vue3路由传参(query)
1.在主组件中引入路由import { useRouter } from "vue-router";2.创建路由对象const route = new useRouter()3.在组件中绑定方法<goods-list-itemv-for="(item,index) in goods.list":product="item" :key="index"@click="goDetail(item.
![](https://csdnimg.cn/release/devpress/public/img/ic-book.4f347164.png)
一键AI生成摘要,助你高效阅读
问答
·
1.在主组件中引入路由
import { useRouter } from "vue-router";
2.创建路由对象
const route = new useRouter()
3.在组件中绑定方法
<goods-list-item
v-for="(item,index) in goods.list"
:product="item" :key="index"
@click="goDetail(item.id)">
</goods-list-item>
4.在setup中实现该方法
const goDetail = (id) => {
route.push({
path:'/detail',
query:{id}
})
}
5.在需要接收参数的组件中引入
import { useRouter } from "vue-router";
6.在需要接收参数的组件中创建路由对象
const router = useRouter();
7.路由接收
state.id = router.currentRoute.value.query.id
更多推荐
所有评论(0)