vue的下拉无线刷新InfiniteLoading组件,连续点击的时候,怎么能不查询出重置数据。

我发现连续点击查询按钮的时候,往表格填充的数据会重复。 如果等加载完毕之后点击查询,往表格填充的数据是正常的, 怎样控制 连续点击查询的时候,往表格填充的数据是不重复的。 问题:连续点击查询按钮,会连续调用后端接口,往表格填充的数据就会重复。

mounted() {
    this.load();
  },

  methods: {
    //延迟0.6秒执行一次查询方法
    onInfinite() {
      setTimeout(() => {
        this.myRisk();
      }, 2000);
    },

    // 按风险级别和风险查询当前登录人的风险
    search() {
      var that = this
      that.currentPage = 1;
      that.riskLists = [];
      that.$refs.infiniteLoading.$emit("$InfiniteLoading:reset");
      that.myRisk();
    },

    // 查询登录人的所有风险,每次查询10条
    myRisk() {
      // debugger;
      var that = this;
      var param = {
        page: that.currentPage,
        fxjb: that.riskLevel,
        fx: that.riskName,
      };
      console.log(param);
      var url = Vue.__ctx + "/aqsk/aqRiskIdentify/selectRiskByUserOrJob";
      var post = Vue.baseService.post(url, param);
      post.then(function (data) {
        if (data.isOk === false) {
          that.$refs.infiniteLoading.$emit("$InfiniteLoading:complete");
          return;
        }
        if (!data.rows.length) {
          that.$refs.infiniteLoading.$emit("$InfiniteLoading:complete");
          return;
        }
        
          that.currentData = data.rows;
          that.currentPage = that.currentPage + 1;
          console.log(that.currentPage);
          that.riskLists = that.riskLists.concat(that.currentData);
          that.$refs.infiniteLoading.$emit("$InfiniteLoading:loaded");
      
      });
    },

    // 页面每次加载时,设置当前页为1,风险数据重置成空数组,设置infiniteLoading为重置
    load() {
      this.currentPage = 1;
      this.riskLists = [];
      this.$refs.infiniteLoading.$emit("$InfiniteLoading:reset");
      this.myRisk();
    },
  },

  // 注册InfiniteLoading组件
  components: {
    InfiniteLoading,
  },

查询的时候,按钮禁止点击