v-select/Vue: How to enter value not in the list?

Viewed 3187

I'm trying to find a way to add a new value using v-select previously not in the list. So that the new value entered will become the selected option.

This is my current code:

        <v-select
          ref="systemSelect"
          v-model="reservation.system"
          name="system"
          label="Select System"
          :disabled="isBusy"
          :options="systems"
          @input="getSystems"
        />

In UI the component looks like this. Here I use Vuex only to get :options. Currently if I enter a new value and click outside that value disappears since its not found in the list

enter image description here

Expected: Would like to enter a new value and use this value as current in the form and save it. Is there a way to achieve this?

Any help would be appreciated.
Thanks!

1 Answers
Related