AtMultipleFilter

沈孟平

最后更新于 2025-11-18 14:57:11

一个多选过滤器。

• 半选显示徽标可控
• 自定义筛选组件
• 默认有 Slider, DatePicker 两种组件
• 支持自定义组件
• 可无限级展开嵌套
• 样式美观

代码演示

基础示例

API

AtMultipleFilter Props

名称	类型	默认值	说明	版本
model-value	array	必填项	选项内容, 详情见类型声明
show-badge	boolean	undefined	是否显示徽标
on-update:model-value	function	必填项	值更新时执行的回调

AtMultipleFilter Expose

名称	类型	说明	版本
get-data	() => TagItem[]	推荐使用，调用才产生计算
checked-data	TagItem[]	需要实时知道选中变化，调用这个，性能消耗较大

类型声明

显示类型声明

interface TagItem {
  title: string
  id: string
  checked?: boolean
  expand?: boolean
  tags?: TagItem[]
  notLeaf?: boolean
  type?: 'datePicker' | 'slider' | 'custom'
  value?: any
  props?: any
  component?: any
  /** 设置为 true 则他的子级变为单选，不设置为多选 */
  single?: boolean
}

changelog

ba721 - feat(AtMultipleFilter): 优化响应式样式 on 2024/11/28

7ea08 - feat(AtMultipleFilter): 交互和显示优化 on 2024/11/28

bbf12 - feat(components): add AtMultipleFilter on 2024/11/27

贡献者

沈

夏