Customizing item-text in v-select

Yes you can, using scoped slot as described in the doc and provide a template.

For v-select you have two scoped slot :

• selection : to describe how v-select should render items when selected
• item : to describe how v-select should render items when opened

It looks like this :

<v-select> // Don't forget your props  <template slot="selection" slot-scope="data">    <!-- HTML that describe how select should render selected items -->    {{ data.item.name }} - {{ data.item.description }}  </template>  <template slot="item" slot-scope="data">    <!-- HTML that describe how select should render items when the select is open -->    {{ data.item.name }} - {{ data.item.description }}  </template></v-select>

CodePen with a complex example

Vuetify Doc about Scoped Slot in V-Select

Edit for Vuetify 1.1.0+ : Those slots are also available with new components v-autocomplete and v-combobox as they inherit from v-select.

Edit for Vue 2.6+, replace :

• slot="selection" slot-scope="data" by v-slot:selection="data"
• slot="item" slot-scope="data" by v-slot:item="data"

Shorthand :

:item-text="item => item.name +' - '+ item.description"

Slot removes autoselect on focus.

item-text tye can be: string | array | function

then we can make:

:item-text="text"

and

methods: {  text: item => item.name + ' — ' + item.description}