Input deleted after having one item selected

[kno]

You can see this behaviour in the DEMO. It starts with one item selected. If you want to add any character, the input is deleted. this happens every time you have one item selected. I your code starts with empty item, the first character is ignored.

[krugerdavid]

I have the same issue; I get the initial list from an API call, set the selected item but when I want to change the value, the first characters get deleted.

on my getLabel method I have return item ? item.value : '';

If I only put return item.value; it throws an error

Error in callback for watcher "value": "TypeError: Cannot read property 'value' of null"

found in

---> <VAutocomplete>

Please some feedback @paliari :D

[Garima]

If anyone has any solution to this please update,i'm also facing same issue.

@paliari Please help

[RomkaLTU]

Set item: null, not false or {}

[dstrohschein]

I am facing this same issue - setting the item to null didn't affect anything. It seems the author has abandoned this project.

UPDATE: What RomkaLTU was trying to say is that the object you bind to the control - what you set in the v-model attribute - that must be set to null in the data function of vue. This is because of how the first input change is handled. So to fix this, if your code is below it will work:

<v-autocomplete v-model="MyItem"></v-autocomplete>
data() {
   return {
       MyItem: null
     }
  }

[andhikayuana]

I am facing this same issue, you need to change the code like below

....
getLabel (item) {
    return item == null ? '' : item.email;
},
....

it's work for me

[sunupf]

You can see this behaviour in the DEMO. It starts with one item selected. If you want to add any character, the input is deleted. this happens every time you have one item selected. I your code starts with empty item, the first character is ignored.

I think the reason is that when the v model is not null, anything we type will deleted and set the v model to become null. we can bypass it by setting the v-model to null after we select the suggestion, so it'll always accept the first character

for example, I use the item-clicked event: ... v-model="person" @item-clicked="updateInvited" ...

on your javascript

updateInvited: function(item) { this.person = null }

I hope it help