开发过程中经常会遇到路由跳转需要携带参数的情况,在大多数单页面中,一般都是通过使用vue-router
来实现路由的。通过在Vue实例内部访问$router
来访问路由实例,调用this.$router.push
导航到不同的URL。
提示:如果提供了path
,params
会被忽略
-
params传参
router.push({ name: 'testpath', params: { userId: '123' } })
params传参不会显示在URL中,query传参会显示在URL中
//接收参数 this.$route.params.userId
-
query传参
// 带查询参数,变成 /testpath?test=abc router.push({ path: 'testpath', query: { test: 'abc' } }) // 这里的 params 不生效 router.push({ path: '/test', params: { key:'abc' } })
//接收参数 this.$route.query.test