vue携带参数跳转页面(欢迎提问)

请直奔2.0，下面是第一次尝试，虽然成功了，但是不如更新的方便

Vue学习——携带参数跳转页面

（）
scope.row.staffId是表单元素

//按钮代码
<el-button @click="gotoupdate1(scope.row.staffId)" 
	type="primary"
 	style="margin:10px 20px;">跳转
</el-button>

//对应方法gotoupdate1
gotoupdate1 (id) {
      this.$router.push('/update1/catchquery/' + id)
    }

2、index.js加上路由注意path格式

{
      path: '/update1/catchquery/:id',
      name: 'catchquery',
      component: catchquery
}

3、接收参数id,query就是按钮界面的id

created () {
   this.query = this.$route.params.id
},

---

Vue学习——携带参数跳转页面(2.0)

1、携带参数

//按钮代码
<el-button @click="gotoupdate1(scope.row.staffId)" 
	type="primary"
 	style="margin:10px 20px;">跳转
</el-button>

跳转按钮对应的方法

// 进入更新1界面
    gotoupdate1 (staffMessage) {
      this.$router.push({path: '/update1/catchquery', query: { qry: staffMessage }})
    },

2、路由路径

{
      path: '/update1/catchquery',
      name: 'catchquery',
      component: catchquery
}

3、接收参数

this.te = this.$route.query.qry

有什么疑问欢迎提问，本人也是菜鸟