Vue 路由传参的三种常用方法

在实现Vue多界面应用中，我们经常需要在页面跳转时讲数值传递到另一个页面，那么下面就来介绍下实现路由传参的三种方法。

一、Path后加参数

传递方法（id为参数）

this.$router.push({
   path: '/result/${id}'
 })

接收方法

this.$route.params.id

二、Params属性

传递方法

this.$router.push({
   name: 'result'，
   params: {
   	id: id
   }
 })

接收方法

this.$route.params.id

注意，params里params方法当接收页面刷新参数会丢失！想要刷新不丢失的话看下一个query方法。

三、Query属性

传递方法

this.$router.push({
   path: '/result'，
   query: {
   	id: id
   }
 })

接收方法

this.$route.query.id

路由传参就是这三个常用的方法，下期给大家详细讲下Vue的路由使用~


↓喜欢文章的话，就给作者点个赞加关注吧~