简体   繁体   中英

Input custom text into v-select

I have a v-select in my project, with set of items, which are coming from my local storage. What i want to achieve is to allow user to input some data in v-select (some data, what do not exist in my storage or items), as well as selecting data from items of v-select and allow them to save it. I tried to do it from @change, but no luck for me. Is it any way to do this properly with vuetify/vue, or i should use some additional libraries? Here is my code of my v-select

           <v-select
          item-text="title"
          item-value="title"
          value="source.position"
          label="position"
          dense
          autocomplete
          :items="getPositions()"
          @change="jobPositionUpdate">
        </v-select>

Thank you in advance!

It seems to me you need to use combobox. According to Vuetify Website "With Combobox, you can allow a user to create new values that may not be present in a provided items list."

<v-combobox
   v-model="selected"
   item-text="title"
   item-value="title"
   value="source.position"
   label="position"
   dense
   :items="getPositions()"
   @change="jobPositionUpdate">
</v-combobox>

Adding a v-model helps with tracking all the things user has selected and/or added to combobox.

Another tip is that using autocomplete in v-select is deprecated. see . You can use <v-autocomplete> instead

The technical post webpages of this site follow the CC BY-SA 4.0 protocol. If you need to reprint, please indicate the site URL or the original address.Any question please contact:yoyou2525@163.com.

 
粤ICP备18138465号  © 2020-2024 STACKOOM.COM