該組件用于在一組備選項中執行單選操作。下文介紹組件的詳細配置方法。

應用示例

使用單選組件查看某超市不同水果剩余的庫存量,如圖所示。

示例

步驟一:添加組件

  1. 創建Web應用。具體操作,請參見創建Web應用
  2. 在Web應用編輯器中,單擊最左側的組件圖標組件
  3. 在畫布左側組件列表上方,輸入單選,找到該組件,然后將組件拖拽到中間畫布。

    有關組件添加的更多信息,請參見添加組件

    單選組件

步驟二:配置數據源

  1. 在Web應用編輯器右側樣式中,單擊數據源配置數據源
  2. 數據源配置頁面,選擇數據源類型,完成配置。
    可選數據類型有接口靜態數據應用推送
  3. 單擊確定

步驟三:配置樣式

  1. 在右側樣式中,完成組件展示的配置。
    配置項 說明
    單選配置 設置默認選中項和是否禁止

    當未配置數據源,或數據源的數據為空時,默認選中不顯示。

    選中禁止表示不支持在預覽態執行單選操作。

    單選樣式 設置單選類型、各選項排列方向、組件背景色、標簽文字和按鈕樣式。
  2. 調整組件在頁面中的最終位置。有關組件通用樣式配置的更多信息,請參見樣式配置

步驟四:配置交互動作

  1. 選中組件的交互頁簽,配置事件和交互動作。具體操作請參見交互配置
    該組件支持事件值改變點擊。組件值為所選label對應的value值。
  2. 單擊頁面右上方的預覽,預覽和調試組件展示的數據和效果。