【Vue】el-autocomplete禁用时仍会触发下拉的问题

文章目录

  • 问题
  • 解决


问题

el-autocomplete 禁用时,点击后仍会触发下拉,导致出现bug

<el-autocomplete
  v-model="modelValue"
  :fetch-suggestions="queryAsync"
  class="autocomplete"
  :disabled="isDis"
  @select="doSelect($event, item)"
  @change="doChange($event, item)"
  clearable
  placeholder="请输入"
>
el-autocomplete>

解决

试了一下官方disabled属性、@focus、@click.stop均不起作用,最后无奈只能在查询方法那里做处理


function queryAsync(queryString, cb) {
  // 重点
  if (!queryString || isDis.value) {
    cb([])
    return
  }
  const data = {}
  queryFn(data).then((res) => {
    cb(res)
  })
}

你可能感兴趣的:(vue,vue.js,javascript)