vue.js路由传参的几种方式介绍

tyy_Rany

于 2020-04-16 11:28:08 发布

阅读量838

点赞数 1

分类专栏： vue 文章标签： vue

本文链接：https://blog.youkuaiyun.com/skr_Rany/article/details/105553729

版权

本文介绍了Vue.js中路由参数传递的五种方法，包括使用name和params、path和query，以及通过url、直接拼接参数的方式。同时，提到了this.$router.push()、replace()和go()的区别，以及query和params在处理参数时的不同，query类似于GET，参数显示在URL，而params类似于POST，刷新页面后参数消失。

摘要生成于 C知道，由 DeepSeek-R1 满血版支持，前往体验 >

注意：path匹配路由传参只能用query去接收参数，name来匹配路由只能用params去接收参数

方法一：用name传递参数

routes: [
    {
   
      path: '/',
      name: 'Hello',
      component: Hello
    }
]


在相应路由里接收 :console.log(this.$route.name) // Hello

方法二：使用name来匹配路由，然后通过params来接收参数
基本语法：

<router-link :to="{name:xxx,params:{key:value}}">valueString</router-link>
示例：<

最低0.47元/天解锁文章