Vue-select: v-model="selected" only shows the value and not the label as selected

[cangel-cast]

When I set an array of objects as the options like this:
users: [{value: 1, label: "Name 1"}, {value: 2, label: "Name 2"}]

With a selected value
userid: 1

And create the element using:
<v-select :options="users" v-model="userid"></v-select>

The selected label that is displayed _should say_ "Name 1", but instead it always shows the value 1 as selected. If I select Name 1 in the drop down and select it directly, then the label populates the select field correctly. But the userid value doesn't change in the Vue inspector tools.

I noticed what does change is the "mutableValue" in data for the VSelect component. At first it states the passed in value of "1" and that's it. Then after selection it correctly displays the object.

I've always attempted to set a timeout to populate the userid variable after a few seconds but it seems to always show the value and not the label.

Should I be firing a change event on load and after each manual change?

[cangel-cast]

Never mind. I see now that it doesn't look for the value within the object the way it looks for the label key. I needed to set the entire object as the selected value. So it becomes:
userid: {value: 1, label: "Name 1"}

[sagalbot]

Yep, glad you sorted that out!

[andrii-trush]

I expected only values on select, not an object. How can i do it when a set and value and label.

[maxorlovsky]

I agree with @andrii-trush as this is counter-intuitive.

[odedglas]

@cangel-cast Actually this is NOT true,
EVEN if you supply as selected value the Object itself e.g {value:1, label: "Name 1"} , It will display the selected value label of course, BUT if you take a good look, you will see that the component did not actually selected that option ( there is not selected class on the option you expect ).