Label

用来改进表单组件的可用性。

使用for属性找到对应的id,或者将控件放在该标签下,当点击时,就会触发对应的控件。 for优先级高于内部控件,内部有多个控件的时候默认触发第一个控件。 目前可以绑定的控件有:button, checkbox, radio, switch。

参考文档

类型

  1. ComponentType<LabelProps>

示例代码

  • React
  • Vue
  1. class App extends Components {
  2. render () {
  3. return (
  4. <RadioGroup>
  5. <Label className='example-body__label' for='1' key='1'>
  6. <Radio id='1' value='USA'>USA</Radio>
  7. </Label>
  8. <Label className='example-body__label' for='2' key='2'>
  9. <Radio id='2' value='CHN' checked>
  10. CHN
  11. </Radio>
  12. </Label>
  13. </RadioGroup>
  14. )
  15. }
  16. }
  1. <template>
  2. <radio-group>
  3. <label class="example-body__label" for="1" key="1">
  4. <radio id="1" value="USA" />
  5. USA
  6. </label>
  7. <label class="example-body__label" for="2" key="2">
  8. <radio id="2" value="CHN" :checked="true" />
  9. CHN
  10. </label>
  11. </radio-group>
  12. </template>

LabelProps

参数类型必填说明
forstring绑定控件的 id,RN中不支持

API 支持度

API微信小程序百度小程序支付宝小程序字节跳动小程序H5React Native
Label✔️✔️✔️✔️✔️✔️