[vue-select warn]: Label key "option.name" does not exist in options object

[chrisgrim]

Hi
I have the code

 <v-select 
            v-model="user"
            @search="asyncGenerateUserList"
            label="model.name"
            :options="users"></v-select>

and then when I generate the list it returns an array of objects. Here is an example object

{document: (...)
highlight: (...)
index_name: (...)
model: {card_brand: (...)
     card_last_four: (...)
     created_at: (...)
     email: (...)
     id: (...)
     name: (...)}
score: (...)}

{document: (...)
highlight: (...)
index_name: (...)
model: {card_brand: (...)
     card_last_four: (...)
     created_at: (...)
     email: (...)
     id: (...)
     name: (...)}
score: (...)}

So in each object the actual name is inside the model object. But when I try to get the dropdown it shows

Label key "option.model.name" does not exist in options object {"model":{"id":48,"name":"Jessica Creane","email":"[email protected]"....

How do I setup the label key correct so the dropdown list only shows the model object and when I select the user it only adds the model object?

Thanks!

[kamerat]

You can use the prop getOptionLabel

 <v-select 
        v-model="user"
        @search="asyncGenerateUserList"
        :options="users"
        :getOptionLabel="user => user.model.name"
>
</v-select>

[chrisgrim]

Thank you so much!!

[chepe263]

In my case, i had a v-model="selected_user" and it was an empty object. The solution was add a property name to selected_user with an empty string value

<v-select 
        v-model="selected_user"
        label="name"
        :options="users"
>
</v-select>

export default {
  data: function(){
    return {
      selected_user: {
           + name: ''
       }
    }
  }
}