Let's say I have a vue-component that is able to store multiple options from a api-fetching-based autocomplete.

Looks a lot like this one but the model (which I think represents the selected entries) is an array and the v-autocomplete has the multiple option. https://vuetifyjs.com/en/components/autocompletes/#api-search

here is the codepen I edited https://codepen.io/cesarbonadio/pen/bGYLMGa?editors=1010

The problem is that I can't get it work when I try to preload already persisted data to that component.

what I currently do:

I pass the data through a prop, then I map it and assign it to the model property of the component.

The problem is that at the first instance, the selected options doesn't show up, only when I do the search inside the autocomplete, which causes the search-string to update.

if I initialize the search string as search: "", then it works, it does a search with the search-string empty, fetching all the elements that matches with "" (in other words, all of them). This is bad performance and it is not ideal because I have like 8 or 9 autocompletes inside the same parent-component.

What I can do to show up the selected options without forcing the empty search?