选择一个选项后,vuetify的v-autocomplete无法编辑文本输入

时间:2019-01-23 06:55:21

标签: javascript html5 vue.js autocomplete vuetify.js

Code is on codepen:

https://codepen.io/anon/pen/exYjOZ

如果转到此页面,然后在搜索框中键入“乔”,则选择出现的两个乔之一,然后尝试在搜索框中选择文本,或者尝试使用退格键仅删除最后一个字符。

您会看到它不允许您编辑文本输入,它只能在按两次退格键后删除文本输入中的整个文本。

它应该允许我在选择一个选项之后选择/编辑文本输入,就像选择它之前一样。

1 个答案:

答案 0 :(得分:1)

我认为原因是使用slot="selection"

要使其正常运行,您可以改用item-text

   <v-autocomplete 
      ...
      text="displayText">
   </v-autocomplete>

并定义了displayText方法:

methods: {
  ...
  displayText (item) {
     return item.firstName + " " + item.lastName
  }
}

请检查demo on codepen