vue-router中使用push进行路由跳转时传参的问题

qq_31347253 2018-07-11 05:58:15

vue-router中使用push进行路由跳转时想要传参，若使用Path跳转则需要使用query传参，若使用name跳转则需要使用params传参，否则取得的参数为undefined

...全文

1619 2 打赏收藏举报

写回复

2 条回复

切换为时间正序

请发表友善的回复…

发表回复

bujianduandian 2020-01-30

打赏
举报

回复

经过 cnpm run build 测试了么?

钢铁加lulu 2018-07-18

打赏
举报

回复

我使用name和query传参是可以的。你可以参考下:

路由传参 query传参直接在请求路径后面以键值对的形式传递参数的形式为query传参通过$route.query读取对应参数 params传参直接在请求路径后面接参数且需要在对应路由中使用占位符声明接收params参数通过$route.params读取对应参数 router-link标签中 to 的对象写法 to必须为动态数据绑定 ..

在浏览器中，点击链接实现导航的方式，叫做声明式导航。例如：普通网页中点击 a标签链接。vue项目中点击router-link标签链接都属于声明式导航。在浏览器中，调用API方法实现导航的方式，叫做编程式导航。例如：普通网页中调用location.href跳转到新页面的方式，属于编程式导航。vue项目中编程式导航有this.$router.push(),this.$router.replace(),this.$router.go()。

vue3.0取消了2.0部分api，所以路由跳转传值方式有所不同。这里主要讲编程式导航，也就是router.push(location, onComplete?, onAbort?) vue3.0新增API：useRouter和useRoute 一.路由跳转 1.首先在需要跳转的页面引入API---useRouter import { useRouter } from 'vue-router' 2.在跳转页面定义router变量 const router = useRouter()

在Vue中路由跳转有四种方式 router-link this.$router.push() (函数里面调用) this.$router.replace() (用法同push) this.$router.go(n) 一. 不带参路由跳转 1. router-link 路由配置 { path: '/home',name: 'home',component: ()=>import('@/components/router/Home.vue') }, { path: '/index',n

描述：最近想弄一个自己的个人主页，正好vue3也已经出来了，想尝鲜，于是便用vue3来构建了自己的项目，结果处处碰壁，不过这是好事，说明又有很多新的东西学了（等会，我2.x还没学废(ಥ﹏ಥ)）。好的，接下来要分享的是在vue3中要怎么去使用router路由。 1.安装 npm install vue-router@4 --save ...

87,984

社区成员

224,681

社区内容

发帖

与我相关

我的任务

社区管理员

加入社区

近7日
近30日
至今

加载中

查看更多榜单

社区公告

暂无公告

试试用AI创作助手写篇文章吧

+ 用AI写文章