过滤前的Vuetify自动完成最小字符

Question

是否有一个属性或方法会阻止 Vuetify Autocomplete 过滤要显示的项目，直到满足特定条件，例如键入 3 个字符？我有一个基本的解决方案，但我真的希望有另一个解决方案。在最终用户输入至少三个字符之前，我不希望显示任何内容。我有一个解决方案，例如：

   watch: {
   search (val) {
  if(val.length > 2){
    this.minimumCharacter = 'show'
  }else{
    this.minimumCharacter = 'null'
  } 

在我的 HTML 中：

        <template
      v-if="minimumCharacter === 'show'"
      slot="item"
      slot-scope="{ item, tile }"
    >

当然，自动完成功能在某处有一个可以处理此问题的属性。当您拥有成千上万条记录时，您并不真正希望在键入一个字符后立即显示所有内容。但我搜索了https://vuetifyjs.com/en/components/autocompletes#autocomplete，除非他们称它为我无法关联的东西，否则它不存在。

Answer 1

当然，自动完成功能在某处有一个可以处理此问题的属性。当您拥有成千上万条记录时，您并不真正希望在键入一个字符后立即显示所有内容。但我搜索了https://vuetifyjs.com/en/components/autocompletes#autocomplete，除非他们称它为我无法关联的东西，否则它不存在。

我找不到这样的属性，但对我来说这个变体可以正常工作：

watch: {
  search (val) {
  if(val.length > 2){
     //search code
  }

附：过滤器在搜索后开始工作，因此它不能解决当前任务以阻止搜索。​​

Answer 2

您可以使用 filter prop 来实现自己的过滤功能，如果文本长度小于 3，则该功能始终返回 false：

(item, queryText, itemText) => {
    const hasValue = val => val != null ? val : ''

    const text = hasValue(itemText)
    const query = hasValue(queryText)

    if(queryText < 3) return false;

    return text.toString()
      .toLowerCase()
      .indexOf(query.toString().toLowerCase()) > -1
  }