跳到主要内容

下拉选择框

用于在固定选项中选择一个值，适用于职业类型、语言选择等场景。

一、何时使用​

  • 固定选项单层级选择，如学历、支付方式等
  • 选项数量适中（建议 3～10 项）
  • 选项内容较为稳定、不频繁变更
  • 用户只需选择最终项，无需层级路径展示（非树形结构）

二、属性配置​

1. 数据源​

数据源设置

下拉选择框支持以下数据来源方式：

  • 接口绑定：通过接口动态获取选项列表
  • 数据绑定：绑定父组件或视图数据源，详见：数据绑定
  • 模型绑定：绑定预定义的数据模型，适合结构化数据场景

2. 数据​

数据配置

1）选项名称​

  • 用户在界面上看到的文本内容

2）选项值​

  • 表单提交或内部处理使用的实际值

3）数据绑定​

  • 可绑定上层组件或视图的动态数据源（如父页面传入数据）

详见：数据绑定

4）初始值​

  • 默认选中的选项

示例：

初始值设置

3. 功能​

1）标题​

  • 设置选择框上方标题提示

标题示例

2）占位提示​

  • 选项未选择时显示的提示文字

占位示例

3）取消/确定按钮文本​

  • 自定义底部操作按钮文字，增强本地化体验

按钮配置

4）增加默认项​

  • 在数据源前添加一条“默认项”供用户选择，如“请选择”、“不限”等

增加默认项

  • 默认项值：提交时传递的值（如空字符串、null、0）
  • 默认项文本：显示在界面的提示文字（如“请选择”）

4. 状态​

暂无特殊状态配置，详见：通用状态。

三、样式​

无组件特有样式配置，详见：通用样式。

四、常见使用场景​

1. 订单筛选​

用于订单状态筛选、物流方式选择等。

订单筛选示例

2. 职业类型选择​

用于注册表单或用户信息填写场景。

职业类型示例

3. 多语言切换​

用于 App/系统语言的切换。

语言切换示例