Vuetify 텍스트 필드에서 레이블의 위첨자를 지정하는 방법

Vuetify 텍스트 필드에서 레이블의 위첨자를 지정하는 방법

나는 Vuetify를 쓴다.라벨에 "Target m²"라는 문구를 넣고 싶다.

로 시도했다.<sup>2</sub>근데 안 되네

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

어떻게 하면 라벨에 윗첨자를 넣을 수 있나요?

이름 있는 슬롯을 사용할 수 있습니다.

<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>

이 예를 확인해 주세요.

PS:#label의 줄임말이다v-slot:label

@Boussadjra Brahim의 답은 맞지만 우리는 정의를 내려야 한다.label의 지주이기도 하다v-text-field그렇지 않으면 슬롯에 정의되어 있는 라벨이 사라집니다.

따라서 올바른 방법은 다음과 같습니다.

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

나는 그 대답이 도움이 되길 바라며, 그 공적이 jacekkarczmarczyk에게 돌아가길 바란다.

언급URL : https://stackoverflow.com/questions/64099621/how-to-superscript-a-label-in-vuetify-textfield