• name: 筛选区
• tag_name: SearchArea
• terminal: pc
• category: form
• scene: common

符合 Rookie 设计标准的筛选区组件。

规则

• 筛选条件可设置展开和收起

API

SeachArea

| 属性 | 说明 | 类型 | 默认值 | 是否必填 | |---|---|---|---|---| |className| 自定义 class|string|N/A| 否 | |style|自定义内联样式|object|N/A| 否 | |defaultSearchFields|默认直接展示出搜索项,对应Item中的dataIndex值,不填则全部展示,否则未在此值中的搜索项将会放入收起区|array<string>|N/A| 否 | |searchFields|直接展示的搜索项,使用后变为受控类型|array<string> | N/A| 否 | |defaultActiveFields|默认生效的搜索项,对应Item中的dataIndex值,不填则全部生效,否则未在此值中的搜索项将不生效且也不展示在界面上|array<string>|N/A| 否 | |activeFields|生效的搜索项,使用后变为受控类型|array<string> | N/A |否| | size | 尺寸 | large/medium/small | medium | 否 | | field | Field示例 | object<Field> | N/A | 是 | |tarsHabitKey| tars习惯中的标识,设置后将会出现存储历史搜索记录的按钮,需配合tars系统使用 |string|N/A|否 | |historySelectSearch| 历史搜索记录选择后直接搜索与否 | boolean | true | 否 | |canSearchByEnter| 是否支持按回车键搜索 | boolean | true | 否 | | onSearch | 点击搜索按钮后的回调 |(values: 表单填写的值) => {}|noop| 否 | | onReset | 点击重置按钮后的回调 |() => {}|N/A| 否 | | locale | 自定义的多语言文案数据 | object | 中文文案 | 否 |

PS. children只能为SeachArea.Group与SeachArea.Item

SeachArea.Group

| 属性 | 说明 | 类型 | 默认值 | 是否必填 | |---|---|---|---|---| |label| 分组label |string|N/A| 否 |

PS. children只能为SearchArea.Item

SeachArea.Item

| 属性 | 说明 | 类型 | 默认值 | 是否必填 | |---|---|---|---|---| |label| 搜索项label |string|N/A| 否 | |dataIndex| 搜索项索引,保证唯一性 |string|N/A| 是 | |colSpan| 占的列数| number | 1 | 否 | |canSearchByEnter| 按回车键搜索, SearchArea整体设置成false时不生效, 多行文本框等组件建议手动设置成false | boolean | true | 否 |

其余属性与Form.Item一致 children为对应的Input/Select等表单元素