How to superscript a label in Vuetify textfield

Question

I use Vuetify. I like to have in the label the text "Target m²"

I tried with <sup>2</sub> but it doesn't work

<v-text-field 
  label="Target (in m<sup>2</sup>)"
   v-model="form.target" :error-messages="errors.target" > 
</v-text-field>                                  

How can I i superscript in the label?

Answer 1

You could use named slot label :

<v-text-field  v-model="form.target" :error-messages="errors.target" >
   <template #label>
      <label>Target (in m<sup>2</sup>)</label>
   </template>
 </v-text-field>

please check this example

PS : #label is a shorthand of v-slot:label