对模糊搜索做防抖处理

设置模糊搜索的参数字段

data () {
  return {
    queryParams: {
      departmentId: null,
      page: 1, // 当前页码
      pagesize: 10,
      keyword: '' // 模糊搜索字段
    },
  }
}

双向绑定input输入框，监听值改变事件

<el-input
  v-model="queryParams.keyword"
  style="margin-bottom:10px"
  type="text"
  prefix-icon="el-icon-search"
  size="small"
  placeholder="输入员工姓名全员搜索"
  @input="changeValue"
/>

值改变查询数据

changeValue() {
  this.queryParams.page = 1
  this.getEmployeeList()
}

值改变查询数据-支持防抖查询

changeValue() {
  // 单位时间内只执行最后一次
  // this的实例上赋值了一个timer的属性
  clearTimeout(this.timer) // 清理上一次的定时器
  this.timer = setTimeout(() => {
    this.queryParams.page = 1
    this.getEmployeeList()
  }, 300)
}