# label组件 来改进表单组件的可用性。 >1.使用`for`属性找到对应的`id` ； > >2.或者将控件放在该标签下，当点击时，就会触发对应的控件。 > > `for`优先级高于内部控件，内部有多个控件的时候默认触发第一个控件。 > >目前可以**绑定**的控件有：button checkbox radio switch ***** | 属性名 | 类型 | 说明 | | --- | --- | --- | | for | String | **绑定**控件的 id | ***** ``` <checkbox-group id="check"> <label> <checkbox value="看电影" id="check"></checkbox> <text>看电影</text> </label> <checkbox value="玩游戏" color="red" id="check2"></checkbox> <label for="check2"><text>玩游戏</text></label> <checkbox value="睡觉"></checkbox> <text>睡觉</text> </checkbox-group> ``` >当点击 `玩游戏 和 看电影` 字体是不会选中checkbox , 只能点击选框才能选中。想要点击文本也能选中可以使用label 改进表单组件的可用性 ***** <br> ***** >.`for`优先级高于内部控件，label内部有多个控件的时候默认触发第一个控件 ``` <view>3.label内部有多个控件也没有指定for属性的时候，默认选中第一个</view> <view> <!--label内部有多个控件也没有指定for属性的时候，默认选中第一个--> <label> <checkbox value="玩游戏" checked="{{false}}" color="red"></checkbox><text>玩游戏</text> <checkbox value="看电影" checked="{{false}}" color="red"></checkbox><text>看电影</text> <checkbox value="看电影" checked="{{false}}" color="red"></checkbox><text>看书</text> </label> </view> <view> <!--label内部有多个控件有指定for属性的时候，默认选中指定那个--> <label for='check2'> <checkbox value="玩游戏" checked="{{false}}" color="red"></checkbox><text>玩游戏</text> <checkbox id='check2' value="看电影" checked="{{false}}" color="red"></checkbox><text>看电影</text> <checkbox value="看电影" checked="{{false}}" color="red"></checkbox><text>看书</text> </label> </view> ```