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