vue 跳转页面传参的时候参数值为undefined的解决方法

最新推荐文章于 2024-09-05 11:25:23 发布

梁同学与Android

最新推荐文章于 2024-09-05 11:25:23 发布

阅读量9.2k

点赞数 4

分类专栏： Vue 文章标签： vue参数值undefined vue跳转传参的时候参数值为空

本文链接：https://blog.csdn.net/qq_43290288/article/details/108916098

版权

Vue 专栏收录该内容

26 篇文章 0 订阅

订阅专栏

本文详细介绍了在Vue应用中遇到的路由参数传递问题，当省略了`name`属性时，导致在目标页面获取参数值为undefined。通过分析错误原因并提供修正代码，强调了在使用`$router.push`进行页面跳转时，正确设置`name`属性的重要性，以确保数据在不同页面间正确流转。

摘要由CSDN通过智能技术生成

错误代码如下：

跳转之前的页面：

clickScan(index,row) {
   this.$router.push({
     path: '/biz/AssociationAcitvityEnroll',
     params: {
       associationId: row.associationId
     }
   })
 },

跳转之后的页面

mounted: function () {
   this.associationId = this.$route.params.associationId
   console.log(this.associationId)
},

我们会发现this.assocationId的值为undefined，原因是在跳转之前没有给name属性的值，
正确的代码如下：

跳转之前的页面：

clickScan(index,row) {
  this.$router.push({
       name: '社团活动',//这里必须有，没有的话传过去的值为undefined
       path: '/biz/AssociationAcitvityEnroll',
       params: {
         associationId: row.associationId
       }
   })
},