全部产品

多选和单选

移动可视化开发提供了多选和单选两种选择组件,可用于在一组备选项中执行多选或单选操作。下文介绍该组件的详细配置方法。

步骤一:添加组件

  1. 创建移动应用。

    具体操作,请参见创建移动应用

  2. 在移动应用编辑器中,单击最左侧的组件图标组件

  3. (可选)添加分栏组件,进行应用页面布局设置。

    具体操作,请参见横向分栏和纵向分栏

  4. 在画布左侧组件列表上方,输入多选单选,找到该组件,然后将组件拖拽到中间画布或画布中分栏组件的某栏中。

    更多信息,请参见添加组件

    多选示例

步骤二:配置数据源

  1. 在移动应用编辑器右侧样式中,单击数据源配置数据源

  2. 数据源配置页面,选择数据源类型,完成配置。

    可选数据类型有接口静态数据

  3. 单击确定

步骤三:配置样式

  1. 在右侧样式中,完成组件展示的配置。

    配置项

    说明

    多选配置、单选配置

    设置是否禁止选择。

    选中禁止复选框后,表示不支持在预览状态执行选择操作。

    多选样式、单选样式

    设置各选项排列方向、尺寸、按钮选中颜色、按钮未选中颜色和文字颜色。

  2. 调整组件宽高和在页面中的布局位置。

    更多信息,请参见通用样式

步骤四:配置交互动作

  1. 选中组件的交互页签,单击新增交互,设置事件动作

    支持值改变点击事件。多选的组件值为所选label对应的value值组成的一维数组,例如 ["2","4","7"]。单选的组件值为所选label对应的value值。

    具体操作,请参见交互配置

  2. 单击页面右上方的预览,查看或调试组件的展示数据。