跳到主要内容
Select
下拉框用于在一组选项中选择一个或多个项时,用户可以点击一个按钮,展开一个菜单,然后选择所需的选项。

构成元素

Untitled

  1. 标签:用尽可能简单的词汇表明当前表单的作用
  2. 触发器:用于触发选择菜单以及选择之后回填内容
  3. 选择菜单:可供选择的内容集合

类型

Untitled

尺寸

S 高度:24px 宽度:遵循页面栅格化

M 高度:32px 宽度:遵循页面栅格化

L 高度:40px 宽度:遵循页面栅格化

相关组件对比

差异对比

用法

什么时候使用

  • 需要从一组既定内容中选择一个或多个值
  • 选择的内容不是主要的,不需要立即显示

什么时候不使用

  • 需要从一组功能中选择一个并执行,请使用 Dropdown
  • 需要选择是与否,请使用开关
  • 需要从复杂的数据中选择值,请使用树
  • 需要选项始终展示,请使用 Radio 或 Checkbox
  • 需要从复杂的数据中选择值,并希望已选、未选能够对比,请使用穿梭框

行为

出现方式

  1. 在单选情况下,点击选择器展示可供选择的选项列表,用户选择一个选项后,列表框将关闭,所选选项将显示在选择器中。
  2. 在多选情况下,点击选择器展示可供选择的选项列表,用户选择一个或多个选项后,点击确定,列表框将关闭,所选选项将显示在选择器中。
  3. 在此点击选择器展示选项列表,已选的内容会高亮显示。

生命周期

可供选择的选项列表展示的情况下,单选选择选项、多选选择后点击确认,将确认选项结束流程,或点击空白区域也将结束流程。

全局变化

跨端的变化

  • PC上选项的的内容由浮窗承载,在移动端选项的内容由底部抽屉承载

相关资源

同类组件