My v-select is set up to map objects in the following way:
<v-select
v-model="object"
:items="objectsArray"
label="Select Object"
item-text="name"
item-value="id"
></v-select>
Where:
- The 'object' variable has this structure: {'id': 'Foo','name':'Bar'}
- And 'objectsArray' is an array of objects with the same structure: {'id': 'Foo','name':'Bar'}
The issue I am facing is that during the initial render, it displays the 'name' property in the select, but upon changing the object, it becomes a string containing the 'name' of the selected item, for example, 'Bar'.
Questions: 1-How can I replace the 'object' with the full value of the selected item i.e., {'id':'Foo','name':'Bar'} instead of just the 'name' property. 2-How can I replace the 'object' with just the 'id' property i.e., 'Foo'.
Observation:
If I remove the item-text attribute from v-select, it shows [Object object] in the select. However, upon change, it updates the 'object' with the 'id' property, in this case, the id.