Skip to content

TableFilterDrawer 表格筛选抽屉

xy-table-filter-drawer 适合在列表页收纳不常用但复杂的筛选条件,让主筛选栏保持简洁。

基础用法

常见做法是把高频筛选放在 SearchForm,把次级条件收进这个筛选抽屉里。

当前定位

  • 负责高级筛选抽屉的容器、字段承载和应用重置出口。
  • 适合与 SearchForm、ProTable 配合形成主次筛选闭环。

当前边界

  • 当前不处理筛选字段的远程配置和条件持久化。
  • 真正的筛选协议和表格刷新仍由页面层接管。

TableFilterDrawer API

TableFilterDrawer Attributes

属性说明类型默认值
open是否打开抽屉,支持 v-model:openbooleanfalse
title抽屉标题string'筛选条件'
model筛选表单数据对象,必填,字段名需与 fieldsprop 对应Record<string, unknown>-
fields筛选字段 schema,内部交给 XyProForm 渲染,继承 ProFieldSchema 的能力ProFieldSchema[][]
drawer-props透传给 xy-drawer 的 props,继承自 DrawerProps(Omit 掉 modelValue / title)的关键属性,如 size(默认 420)、placementcloseOnOverlaydestroyOnClosebeforeCloseOmit<Partial<DrawerProps>, 'modelValue' | 'title'>{}

TableFilterDrawer Events

事件名说明参数
update:open抽屉开关状态变化时派发(value: boolean) => void
apply点击「应用筛选」时派发,携带当前 model 的浅拷贝,随后自动关闭抽屉(payload: Record<string, unknown>) => void
reset点击「重置」时派发,携带当前 model 的浅拷贝,随后自动关闭抽屉(payload: Record<string, unknown>) => void
closed抽屉关闭动画结束后派发() => void