vue3路由及传参

目录

一、vue3路由及传参

1.介绍

2、query传参

3、params


一、vue3路由及传参

1.介绍

vue3路由和vue2几乎一样,只不过在传参形式上略有改变

vue2路由传参:query,params

2、query传参

  • path配合

  • 刷新页面参数不丢失

  • 代码演示:

 A页传参:
 到详情页
 
 
B页接参:
import { useRoute } from 'vue-router'

//获取参数
const route = useRoute()
console.log('route:', route.query.id)

3、params

  • 和name配合

  • 刷新页面参数会丢失

  • 演示代码:

 A页传参:
 到详情页
 
 
B页接参:
import { useRoute } from 'vue-router'

//获取参数
const route = useRoute()
console.log('route:', route.params.id)

router index.js里
path:'/detail:id'

你可能感兴趣的:(前端,javascript,html5)