I have recently upgraded to Vuetify 3 from Vuetify 2. All the disabled v-text-field are not selectable by dragging the cursor. However, I noticed that v-autocomplete and v-select, even when disabled, have text selectable. Does anyone know the solution to this?
I tried testing it on regular html elements, without Vuetify. HTML input elements when disabled can select text but not vuetify disabled input fields
Edit: I tested it again and found out that when the element has v-model, the text is no selectable.
<v-text-field
:label="$t('softwareEditLabelKey')"
v-model="software.key"
:disabled="!isNewSoftware"
>
</v-text-field>
But is selectable when typed the following way:
<v-text-field
:label="$t('softwareEditLabelKey')"
:disabled="!isNewSoftware"
>
{{software.key}}
</v-text-field>
But when used the second way, the label is also merged as placeholder along with value.
Link to vuetify Playground: https://play.vuetifyjs.com/#eNpNjMEKwjAQRH9lyaUXa+6SFvwGvRkPNVklsE1DdhME8d9N66WXGQbevNtHcXb6nNKxFlQnZQTnRJPgaCOAqb3gW/pnQPJQ+3nxSINVgixWgQ88PQj9CEbvyfY1eidqk10OSYBRStrUbokssIpggO7a+iI5xFe3fv9049T3EAvRFvcfkSs9WQ==