input输入框 使用 防抖

防抖

<el-input v-model="value" @input="inputChange"></el-input>

<script>
export default {
  data () {
    return {
      value: '',
      timer: null
    }
  },
  methods: {
    inputChange() {
      if (this.timer !== null) clearTimeout(this.timer)
      this.timer = setTimeout(() => {
        console.log(this.value)
      }, 1000)
    }
  }
}
</script>

节流

throttle() {
  if (this.flag) {
    setTimeout(() => {
      console.log('value')
      this.flag = true
    }, 1000)
  }
  this.flag = false
}

附加

// 防抖 -- 相当于“回城”，每次都重新计时
// 节流 -- 相当于“技能”，冷却结束后，才可继续执行