@option:selected return whole multiple selection and not the single involved option

[milanteo]

Please respect maintainers time by filling in these sections. Your issue will likely be closed without this information.

• Vue Version: vue@3.2.32
• Vue Select Version: vue-select@4.0.0-beta.3

Describe the bug The function executed on the @option:selected event on a multiple select receives as argument the whole selection and not the single option

Expected behavior The function should receive as argument only the single involved option.

[euperia]

I can confirm this bug:

• Vue version: 2.6.14
• Vue select version: 3.18.3

<v-select 
    label="name"
    :options="selectOptions"
    v-model="userOptions"
    :multiple="true"
    :taggable="false"
    @option:selected="update"
    @option:deselected="remove"
>
</v-select>
...
methods: {
    update (item) {
    console.dir(item)
    },

    remove (item) {

    console.dir(item)
    }
}

With two items already stored in userOptions, selecting a new option outputs:

[
    {
        "id": 1,
        "slug": "google",
        "name": "Google"
    },
    {
        "id": 2,
        "slug": "firefox",
        "name": "Firefox"
    },
    {
        "id": 5,
        "slug": "internet-explorer",
        "name": "Internet Explorer"
    }
]

The deselected call works fine - passing the removed item as expected

[DudhaneShrey86]

As the array returned from @option:selected event ALWAYS preserves the order of the selected values, you can use its length to get the latest selected option.

Now my update method looks like this,

update(item) {
    console.log(item[item.length - 1])
}

As for this,

The function should receive as argument only the single involved option.

I think it's not supposed to be like that. Not entirely sure though! Also note the @option:deselected event does not work with single vue-select