1.0.1 • Published 6 years ago
@alicd/crui-search-area v1.0.1
- 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等表单元素
1.0.1
6 years ago