【VUE】页面A点击后携带参数跳转到页面B并搜索

页面A点击后获取搜索参数，如 ID、Num等，跳转到B页面，使用A页面携带过来的参数在B页面进行搜索。

A页面

html部分

              <template>
                <div
                  @click="getParams(scope.row)"
                >
                  点击跳转
                </div>
              </template>

JS部分

  methods: {
    getParams(row) {
      this.$router.push({
        path: '/B页面路径/',
        query: { id: row.id},
      });
      console.log(row.id, 'row.id');
      console.log(this.$route.query.id, 'this.$route.query.id');
    }
}

B页面

B页面要同时使用watch和activated属性进行操作

如果只添加watch，那么第一次跳转到B页面时参数不会携带并使用携带的参数搜索

  watch: {
    '$route.query.id'(val) {
      if (val) {
        this.queryParams.id= val;
        this.handleQuery();
      }
    },
  },
methods:{
  activated() {
    if (this.$route.query.id) {
      this.queryParams.id= this.$route.query.id;
    }
    this.handleQuery();
  },
}