接收参数使用route,route包含路由信息，接收参数有两种方式,params和query
path跳转只能使用query传参,name跳转都可以
params：获取来自动态路由的参数
query：获取来自search部分的参数
写法
1.用path方法跳转页面,用query传参数 参数多的话只需要在query中继续写就行了
import { useRouter } from 'vue-router' export default { setup() { const router = useRouter(); router.push({ path: '/home', query: { id: 1 } }); } }
在另一个页面使用route接收参数 打印route就能看到上页传的参数
import { useRoute } from 'vue-router' export default { setup() { const route = useRoute(); console.log(route.query.id); } }
2.这是用name的方法跳转传参 query的方法和path的一样
import { useRouter } from 'vue-router' export default { setup() { const router = useRouter(); router.push({ name: 'home', query: { id: 1 } }); } }
接收参数
import { useRoute } from 'vue-router' export default { setup() { const route = useRoute(); console.log(route.query.id); } }
方法其实都一样 只是跳转页面的方法不同 大家可以尝试一下 有什么好的问题我们可以在评论区进行一个讨论 一起交流
