都可以实现参数传递
1. query
地址栏:/about?id=1
配置:
//router.js
{
path:'/about',
name:'About',
component:about
}
//home.vue
<router-link :to="{path:'about',query:{id:'1'}}"></router-link>
//about.vue
import {useRoute} form 'vue-router'
const route =useRoute()
console.log(route.query)
2. params
地址栏:/about/1
配置:
//router.js
{
path:'/about/:id',
name:'About',
component:about
}
//home.vue
<router-link :to="{name:'about',params:{id:'1'}}"></router-link>
//about.vue
import {useRoute} form 'vue-router'
const route =useRoute()
console.log(route.params)