vue2router.query传参
时间: 2024-09-18 07:12:23 浏览: 88
解决vue-router中的query动态传参问题
5星 · 资源好评率100%
Vue Router 的 `query` 参数用于在 URL 查询字符串中传递数据,它是一个键值对的形式,通常用于临时传递信息。在 Vue2 中,你可以这样做来设置查询参数:
```javascript
import { useRouter } from 'vue-router'
// 在组件内
const router = useRouter()
router.push({ path: '/your-route', query: { key1: 'value1', key2: 'value2' } })
```
或者直接在路由链接上添加:
```html
<router-link :to="{ path: '/your-route', query: { param: 'value' } }">Link</router-link>
```
然后,在接收这些参数的地方,可以使用 `this.$route.query` 来访问它们:
```javascript
export default {
computed: {
params() {
return this.$route.query // 返回一个对象,包含所有查询参数
}
},
}
```
阅读全文