下拉多选

使用场景

当需要在限定的可选项内进行多项选择时，您可以使用下拉多选组件。

使用说明

• 在某个容器内或整个页面内拖入下拉多选组件。

• 组件的数据源支持固定数据源及动态数据源。数据源类型需为List<Structure>，Structure为结构对象类型。List中的每个数据对应着下拉选项中每个数据。

  • 当数据源为固定值时，您可按需进行添加、编辑和删除操作。

  • 当数据源为动态值时，支持绑定List<Structure>类型的变量。

使用示例

1. 从组件面板拖拽下拉多选组件至画布。在新增变量对话框中，单击图标。

2. 绑定变量，即给下拉多选绑定初始值。

3. 配置提示信息（展示在下拉多选框中的提示文字）。

4. 配置描述文字（对下拉多选进行修饰说明的文字）。

5. 配置选项配置，其选项来源支持固定值和动态值。

   • 固定值：您可单击编辑数据，在数据编辑对话框中，按需进行添加、编辑与删除操作。

   • 动态值：您需要绑定一个类型为List<Structure>类型的变量，其中Structure为下拉多选中每项数据对应的类型。

6. 配置其他配置。

   • 当开启清除按钮后，您可以一键清除选中的内容。

   • 当开启搜索功能后，您可以在下拉多选框中输入您想搜索的内容，下拉多选框会根据你输入的内容显示过滤结果，页面效果如下图所示。

   • 设置搜索结果为空的文案，当您搜索的关键字不存在对应匹配项时下拉框中会给出对应的提示。

   • 如果选项来源设置为动态值，您需要关闭本地搜索过滤开关。

     如果选项来源设置为固定值，您可以自定义本地搜索过滤方法。单击绑定动作，在自定义本地搜索过滤方法对话框中，您可以选择在页面JS或全局JS中输入对应的方法。

7. 配置校验。

   • 开启校验必填开关，设置校验未通的提示信息。您还可以设置最大个数校验、最小个数校验等。

   • 您可以开启自定义校验开关，按需编辑校验代码。