ant design vue 实现带参跳转页面

功能描述

点击A页面时，跳转到B页面，并在地址中传递参数。

实现思路

A页面中添加@Click事件，进行跳转，我是多个按钮同时调用一个方法，使用传递参数的方式进行区分。

代码实现

A页面代码

在你需要跳转的地方添加@Click事件，传递参数区分哪里进行调用的。

<a-col :md="6" @click="PageJump(3)">
        <div class="content">
          <div class="title">按钮</div>
          <img class="img" src='../../assets/jiandang.png'>
        </div>
      </a-col>
      <a-col :md="6" @click="PageJump(0)">
        <div class="content">
          <div class="title">按钮</div>
          <img src='../../assets/gaoxueya.png'>
        </div>
      </a-col>

JS代码

PageJump(sid) {
      this.$router.push({
          path: '/xxxx/xxxx?type='+sid,
        })
    },

B页面
activated 每次进入到B页面是都会走这个方法，这是他和created()方法的区别，我这边是获取到参数后直接赋值给了查询对象queryParam，然后调用查询方法，请求后台，返回数据。

activated() {
    console.log('接收到的参数', this.$route.query.type)
    //获取路径中的参数
    this.queryParam.threeTag=this.$route.query.type;
    this.loadData()
  },

结束语

这就是整个的实现带参调转页面，不懂得可以私信！！！