Vue.js v-autocomplete并将用户输入设置为其值

我在我的项目中使用，需要typeahead组件。遗憾的是，v-autocomplete实现为带有过滤器的组合框，因此它不允许将用户输入设置为v-model（或者至少我找不到方法来实现）

有人能解释一下如何实现这些功能吗（可能是通过另一个vuetify组件实现的）？我从服务器加载项目，但它们只是作为建议。用户需要能够键入和设置他们想要的任何值

下面是一个基本示例。问题是，如果我键入的单词不是以“John”开头的，v-autocomplete会在模糊中清除它。我曾尝试手动设置v-model并将用户输入添加到数组中，但这些方法中的任何一种都存在问题，无法按预期工作

<div id="app">
  <v-app>
    <v-content>
      <v-container>
        <p>Name: {{ select || 'unknown'}}</>
        <v-autocomplete
          :items="items"
          :search-input.sync="search"
          v-model="select"
          cache-items
          flat
          hide-no-data
          label="Name"
        ></v-autocomplete>
      </v-container>
    </v-content>
  </v-app>
</div>

new Vue({
  el: "#app",
  data: () => ({
    items: [],
    search: null,
    select: null,
    commonNames: ["John", "John2", "John3"]
  }),
  watch: {
    search(val) {
      val && val !== this.select && this.querySelections(val);
    }
  },
  methods: {
    querySelections(v) {
      setTimeout(() => {
        this.items = this.commonNames.filter(e => {
          return (e || "").toLowerCase().indexOf((v || "").toLowerCase()) > -1;
        });
      }, 500);
    }
  }
});

名称：{{选择| |'未知'}
新Vue({
el:“应用程序”，
数据：（）=>({
项目：[]，
搜索：空，
选择：空，
常用名称：[“约翰”、“约翰2”、“约翰3”]
}),
观察：{
搜索（val）{
val&&val！==this.select&&this.querySelections（val）；
}
},
方法：{
查询选择（五）{
设置超时（（）=>{
this.items=this.commonNames.filter（e=>{
返回（e | |“”）.toLowerCase（）.indexOf（（v | |“”）.toLowerCase（））>-1；
});
}, 500);
}
}
});

Vuetify 1.1.7组合框中有新功能，您可以参考

---

它在

上出现了同样的问题，并通过

v-combobox

解决了它。它有点像

v-autocomplete

，因此，您可以用

替换标签，或者查看此处的文档：

您使用的是什么Vuetify版本？因为1.1.7有这样的新特性。请勾选Combobox哇，他们肯定应该将v-Combobox重命名为v-AutoMLETE，反之亦然，因为这是提前打印功能。谢谢@gil看来这正是我要找的。