Vuetify v-select displays number 1 below the select after an item is selected

Question

This doesn't happen in examples from the Vuetify website, but in my code it does. After select an item, bellow the select it appears the number 1, no matter which item was selected. The same occurs if is a list of objects.

<template>
    <v-select label="Select" :items="['One', 'Two', 'Three', 'Four', 'Five']"></v-select>
</template>

What am I missing here?

Answer 1

As mentioned in the comments by @yoduh, it's a bug in v3.3.19. The VSelect passes length of the selected items to the underlying VTextField (code), but VTextField will always show the counter when the value is not false or null (code).

The proposed workaround using :hide-details="true" works, but it will also hide hints and validation errors and make the input shorter than inputs without the prop. If that is a problem, you can also pass an empty counter slot to the VSelect:

<v-select ...>
  <template v-slot:counter></template>
</v-select>

TS will complain that VSelect has no counter slot, but VSelect actually passes it on the VTextField.

Here it is in a playground