@alicd/crui-task-filter
v0.0.19
Published
--- category: Components type: UI Views component: Base chinese: 条件过滤器 english: TaskFilter ---
Downloads
7
Maintainers
Keywords
Readme
category: Components type: UI Views component: Base chinese: 条件过滤器 english: TaskFilter
一般用于查询页中的搜索区功能。
API
TaskFilter
| 成员 | 说明 | 类型 | 默认值 |
| ----- | ----- | ----- | ----- |
| field | 过滤器所绑定的 Field
| Field
| N/A |
| selectKey | 当前面板中所选择的搜索条件 | number|string
| N/A |
| defaultSelectKey | 默认情况下面板所选择的搜索条件 | number|string
| N/A |
| searchPlaceholder | 搜索条件搜索框的提示语 | string
| "过滤搜索条件"
|
| searchCondition | 默认情况下搜索条件搜索框中的值 | number|string
| ""
|
| onChangeCondition | 切换面板左侧的搜索条件时触发的事件 | (selectedKey: string) => void
| 默认不执行任何操作 |
| onSearch | 在搜索条件搜索框中执行搜索操作时触发的事件 | (searchCondition: string|number) => void
| 默认不执行任何操作 |
| onReset | 点击重置按钮触发的事件 | (field: Field) => void
| 默认不执行任何操作 |
| onClear | 点击清空按钮触发的事件 | (field: Field) => void
| 默认不执行任何操作 |
| visible | 是否显示弹层, 如果此属性为 false
,弹层不会被渲染 | boolean
| false
|
| title | 设定弹层标题 | string|number
| "排序设置"
|
| width | 设定弹层宽度 | number
| 800
|
| height | 设定弹层高度 | number
| 640
|
| onOk | 点击确定按钮触发的事件 | (data: object[]) => void
| 默认不执行任何操作 |
| onCancel | 点击取消按钮触发的事件 | (e: object[]) => void
| 默认不执行任何操作 |
| loading | 设置弹层确定按钮载入状态 | boolean
| false
|
| showTitle | 是否显示标题 | boolean
| true
|
| showFooter | 是否显示弹层底部的按钮栏 | boolean
| true
|
| hasMask | 是否显示遮罩 | boolean
| true
|
| className | 自定义类名 | string
| N/A |
| canCloseByEsc | 是否支持 esc 按键关闭弹层 | boolean
| true
|
| canCloseByOutSideClick | 点击弹层外的区域是否关闭弹层 | boolean
| true
|
| canCloseByMask | 点击遮罩区域是否关闭弹层 | boolean
| true
|
| animation | 配置动画的播放方式 | object|boolean
| { "in": "expandInDown", "out": "expandOutUp" }
|
| target | 配置弹层定位的参照元素 | any
| Position.VIEWPORT
|
| align | 弹层相对于target的定位, 详见开发指南的定位部分 | string|boolean
| "cc cc"
|
| offset | 弹层相对于target定位的微调 | number[2]
| [0, 0]
|
| beforeClose | 弹层关闭前触发的事件 | () => void
| 默认不执行任何操作 |
| onClose | 弹层关闭后触发的事件 | () => void
| 默认不执行任何操作 |
| afterClose | 弹层关闭后触发的事件, 如果有动画,则在动画结束后触发 | () => void
| 默认不执行任何操作 |
| beforeOpen | 弹层打开前触发的事件 | () => void
| 默认不执行任何操作 |
| onOpen | 弹层打开后触发的事件 | () => void
| 默认不执行任何操作 |
| afterOpen | 弹层打开后触发的事件, 如果有动画,则在动画结束后触发 | () => void
| 默认不执行任何操作 |
| onRequestClose | 弹层请求关闭触发的事件。参数: reason: string
弹层关闭的来源 e: Event
DOM 事件 | (reason: string, e: Event) => void
| 默认不执行任何操作 |
| beforePosition | 弹层定位完成前触发的事件 | () => void
| 默认不执行任何操作 |
| onPosition | 弹层定位完成后触发的事件。参数: config: object
定位的参数 node: object
定位的元素 | (config: object, node: object) => void
| 默认不执行任何操作 |
| autoFocus | 弹层打开的时候是否让里面的元素自动获取焦点 | boolean
| false
|
| cache | 隐藏时是否保留子节点 | boolean
| false
|
| safeNode | 安全节点,当点击 document 的时候, 如果包含该节点则不会关闭弹层, 如果是函数需要返回 ref, 如果是字符串则是该DOM的 id, 也可以直接传入DOM节点 | any
| N/A |
| wrapperClassName | 弹层的根节点的样式类 | string
| N/A |
| container | 指定渲染组件的容器 | any
| N/A |
| shouldUpdatePosition | 强制更新定位信息 | boolean
| N/A |
| needAdjust | 是否自动调整定位的位置 | boolean
| N/A |
| disableScroll | 是否禁用页面滚动 | boolean
| true
|
| prefix | 样式类名的品牌前缀 | string
| "next-"
|
TaskFilter.Item
| 成员 | 说明 | 类型 | 默认值 |
| ----- | ----- | ----- | ----- |
| key | 作为条目的唯一标示,必须保证在同一个 TaskFilter 下唯一 | string|number
| N/A |
| title | 单个条目的标题 | string
| N/A |
| visible | 该条目是否可见 | boolean
| N/A |
| valuePlaceholder | 显示在标题后面的文案,一般展示用户填的值 | string|number
| N/A |