Vuetify 自动完成功能不显示包含多个搜索词的建议

Question

<v-autocomplete>当我使用 Vuetify和我的 API进行搜索时，只有在编写类似 的单词时mytext才会myvalue正确更新并显示在建议中FOO，如果我编写类似 的字符串FOO BAR，那么我会在 API 调用方法中得到正确的结果console.log(response.data)，但我得到的建议中没有任何内容<v-autocomplete>。

<template>:

<v-autocomplete
  v-model="select"
  :loading="loading"
  :items="items"
  item-text="mytext"
  item-value="myvalue"
  :search-input.sync="search"
  hide-no-data
  hide-details
  label="My Autocomplete"
>
  <template v-slot:item="data">
    <v-list-item-content>
      <v-list-item-title v-html="data.item.mytext"></v-list-item-title>
      <v-list-item-subtitle
        v-html="data.item.myvalue"
      ></v-list-item-subtitle
    ></v-list-item-content>
  </template>
</v-autocomplete>

<script>:

<script>
export default {
  data() {
    return {
      select: null,
      loading: false,
      items: [],
      search: null
    }
  },
  watch: {
    search(val) {
      console.log('search: ' + val)
      val && val !== this.select && this.query(val)
    }
  },
  methods: {
    async query(v) {
      this.loading = true
      await this.$axios
        .get('/api/foo', {
          params: {
            search: this.search
          }
        })
        .then((response) => {
          console.log(response.data)
          this.items = response.data
        })
        .catch((error) => {
          console.log(error)
        })
        .finally(() => {
          this.loading = false
        })
    }
  }
}
</script>

变量search似乎与变量相关联items。

Answer 1

您可以将no-filterprop 应用于您的v-autocomplete组件。

<v-autocomplete
    ...
    no-filter
    ...
>
</v-autocomplete>

正如该道具的文档中所写：

搜索时不要应用过滤。在服务器端过滤数据时很有用

https://vuetifyjs.com/en/api/v-autocomplete/#props