this.$router.push 传参

Posted 2021-03-07 gwkzb

index页面
1.params
this.$router.push()方法中path不能与params同用，否则param会失效，所以用name来指定页面，params来传递数据内容。

 1 <template>
 2 <img src="../../static/images/indexTermianal/teacher.png" alt="" @click ="go()" > 
 3 </template>
 4 <script>
 5 methods:{
 6 　　go:function(){
 7 　　　　this.$router.push({
 8 　　　　　　name:‘indext‘,
 9 　　　　　　params:{
10 　　　　　　　　userId:1
11 　　　　　　}
12 　　　　})
13 　　}
14 }
15 </script>

 

在目标页面通过this.$route.params获取参数：
<p>{{this.$route.params.userId}}</p>

2.query
页面通过path和query传递参数，该实例中row为某行表格数据

 1 methods:{
 2     go:function(){
 3         this.$router.push({
 4     　　　　path:‘/indext‘,
 5 　　　　　　query:{
 6 　　　　　　　　userId:1
 7 　　　　　　}
 8 　　　　　})
 9 　　}
10 },        

 

目标页面this.$route.query.userId获取数据

<p>{{this.$route.query.userId}}</p>