ZartUI — Select 下拉选择框

单选 / 多选(方案一·方案二)

单选下拉框

基础状态
默认
请选择
禁用
请选择
错误
请选择
请选择一个选项
悬停
请选择
激活状态
激活(显示选项)
请选择
选项一
选项二
选项三
选项四
激活(加载中)
请选择
加载中…
激活(含禁用选项)
请选择
选项一
选项二(禁用)
选项三
选项四(禁用)
有值状态
再次悬停
选项一
再次激活
选项一
选项一
选项二
选项三
选项四
完成态
选项一

多选下拉框

触发框状态
默认
请选择
禁用
请选择
错误
请选择
请至少选择一项
完成态(标签全显)
选项一 选项二
完成态(溢出 +N)
选项一 选项二 +3
完成态(禁用)
选项一 选项二
方案一:顶部搜索框
选项较少(无搜索框)
选项一
选项一
选项二
选项三
选项四
新增
选项较多(显示搜索框)
选项一
选项一
选项二
选项三
选项四
选项五
选项六
选项七
选项八
全选状态
选项一 +3
选项一
选项二
选项三
选项四
方案二:框内输入搜索
激活(框内输入)
选项一
选项一
选项二
选项三
选项四
搜索过滤结果
选项一
选项三

弹窗选择

第一种情况:图标 + 文字按钮
默认
请选择 选择
禁用
请选择 选择
悬停
请选择 选择
激活(弹窗已打开)
请选择 选择
完成态
已选项目名称 选择
错误
请选择 选择
请选择一项
第二种情况:纯图标
默认
请选择
禁用
请选择
悬停
请选择
激活(弹窗已打开)
请选择
完成态
已选项目名称
错误
请选择
请选择一项

下拉树选择

触发框状态 + 树形下拉面板
展开 · 树选择
请选择
一级分类 A
子项 A-1
子项 A-2(选中)
子项 A-3
一级分类 B
一级分类 C
数据加载中
请选择
数据加载中...
完成态
子项 A-2

下拉树多选

多选触发框 + 树形下拉面板(含复选框)
展开 · 树多选
子项 A-1 子项 A-2
一级分类 A
子项 A-1
子项 A-2
子项 A-3
一级分类 B
一级分类 C
数据加载中
请选择
数据加载中...
完成态
子项 A-1 子项 A-2

下拉树带搜索

面板顶部含搜索框,支持单选和多选两种形态
带搜索 · 单选
请选择
一级分类 A
子项 A-1
子项 A-2(选中)
子项 A-3
带搜索 · 多选
子项 A-1
一级分类 A
子项 A-1
子项 A-2
子项 A-3
搜索无结果
请选择
暂无匹配数据
返回组件首页