Label - 《Taro 文档帮助手册教程》

sidebar_label: Label
Type
Examples
LabelProps
API Support

title: Label

sidebar_label: Label

Improves the availability of form components.

You can use the for property to find the appropriate ID. Alternatively, you can place the control within this tag, so that you can tap the tag to trigger the corresponding control. The for property takes precedence over internal controls. When multiple internal controls are available, the first control is triggered by default. The following controls can be bound to this component: button, checkbox, radio, and switch.

Reference

Type

ComponentType<LabelProps>

Examples

import Tabs from ‘@theme/Tabs’; import TabItem from ‘@theme/TabItem’;

tsx
class App extends Components {

  render () {
    return (
      <RadioGroup>
        <Label className='example-body__label' for='1' key='1'>
          <Radio id='1' value='USA'>USA</Radio>
        </Label>
        <Label className='example-body__label' for='2' key='2'>
          <Radio id='2' value='CHN' checked>
          CHN
          </Radio>
        </Label>
      </RadioGroup>
    )
  }
}

html
<template>
  <radio-group>
    <label class="example-body__label" for="1" key="1">
      <radio id="1" value="USA" />
      USA
    </label>
    <label class="example-body__label" for="2" key="2">
      <radio id="2" value="CHN" :checked="true" />
      CHN
    </label>
  </radio-group>
</template>

LabelProps

Property	Type	Required	Description
for	`string`	No	The ID of the bound control, not supported in RN

API Support

API	WeChat Mini-Program	Baidu Smart-Program	Alipay Mini-Program	ByteDance Micro-App	H5	React Native
Label	✔️	✔️	✔️	✔️	✔️	✔️