防抖好思想

防抖.jpg

像这种通过计数器形式变更数据，需要防抖，减少不必要的请求

<div class="box">
        <div class="title-box g-flex"><span class="title">检测</span></div>
        <span class="content">支持层级</span><el-tooltip :visible-arrow="false" effect="light"
          content="最高可支持5级" placement="bottom-start"><span
            class="icon-sca-bixu iconfont-sca"></span></el-tooltip> <el-input-number v-model="info.detectDependenceLevel"
          :min="1" :max="5" :precision="0" size="small" step-strictly class="input-number"
          @change="handleChange"></el-input-number>
 </div>

<script>
  export default {
    data() {
     timer: null // 防抖
     },
  methods: {
   async handleChange() {
      if (this.timer != null) clearTimeout(this.timer)
      this.timer = setTimeout(() => {
        this.changeValue() // 发送请求
      }, 1000)
    }
  }
}