全部產品
Search
文件中心

Mobile Platform as a Service:label

更新時間:Jul 13, 2024

標籤(label)可以用來改進表單組件的可用性,使用 for 屬性找到對應組件的 id,或者將組件放在該標籤下,當點擊時,就會聚焦對應的組件。

for 優先順序高於內部組件,內部有多個組件的時候預設觸發第一個組件。

目前可以綁定的控制項有:<checkbox/><radio/><input/><textarea/>

屬性名稱 類型 描述 最低版本
for String 綁定組件的 ID -

圖示

程式碼範例

<view class="section">
  <view class="title">Checkbox,label 套 checkbox</view>
    <checkbox-group>
      <view>
        <label>
          <checkbox value="aaa" />
          <text>aaa</text>
        </label>
      </view>
      <view>
        <label>
          <checkbox value="bbb" />
          <text>bbb</text>
        </label>
      </view>
    </checkbox-group>
  </view>
</view>

<view class="section">
  <view class="title">Radio,通過 for 屬性關聯</view>
    <radio-group>
      <view>
        <radio id="aaa" value="aaa" />
        <label for="aaa">aaa</label>
      </view>
      <view>
        <radio id="bbb" value="bbb" />
        <label for="bbb">bbb</label>
      </view>
    </radio-group>
  </view>
</view>

<view class="section">
  <view class="title">多個 Checkbox 點擊後只選中一個</view>
    <label>
      <checkbox>選中我</checkbox>
      <checkbox>選不中</checkbox>
      <checkbox>選不中</checkbox>
      <checkbox>選不中</checkbox>
      <view>
        <text>Click Me</text>
      </view>
    </label>
  </view>
</view>