Vuetify v-select输入元素不包含任何值

Question

I am using a typical Vuetify's v-select component like this:

<v-select 
    :name="search['type']" 
    v-model="type" 
    :items="typeOptions" 
    label="Type"
>
</v-select>

where typeOptions is an array like this:

typeOptions: [
  { text: 'Residential', value: 'residential' },
  { text: 'Commercial', value: 'commercial' },
  { text: 'Land', value: 'land' },
  { text: 'Other', value: 'other' },
]

The problem is that while v-model holds the appropriate value, the input element with name search['type'] that is created does not hold any value, so I cannot include this v-select component in a form that I want to submit.

Check my codepen here .

I could use a workaround here, by inserting a hidden input depending on this v-model but I don't find it the cleanest solution and in any case I think this should work properly and I cannot understand why it doesn't.

Thanks for any help.

Answer 1

It seems that currently Vuetify currently doesn't support regular form inputs for select, checkboxes and radio inputs. That means when someone is trying to submit them to a server, nothing will be submitted.

This feature is planned to be added on Vuetify 1.1 with the refactoring of input controls. More information on the issue here .