1.0.2 • Published 2 years ago
@m-materials/com-tree v1.0.2
下拉树
@m-materials/com-tree
基于antd TreeSelect 下拉树结构选择器 主要增加了远程加载数据功能
API
| 参数 | 说明 | 类型 | 默认值 | 是否必填 | |
|---|---|---|---|---|---|
| allowClear | 可以点击清除图标删除内容 | boolean | false | ||
| afterSelect | 选择数据行后触发该事件 | Function(item: T, index: number) | - | ||
| afterClear | 清空数据触发该事件 | Function | - | ||
| afterLoaded | 数据请求完成调用该事件，返回接口请求的数据 | Function(data: object[]) | - | ||
| cascadeParams | 级联参数配置 | object | - | ||
| className | 选择框样式名 | string | - | ||
| defaultValue | 输入框默认内容 | string | - | ||
| disabled | 组件失效状态 | boolean | false | ||
| dataSource | 静态数据源 | object[] | [] | ||
| field | 额外提交的表单字段属性名，表单受控 | string[] | [] | ||
| form | antd 表单的 form 属性,参考 antd 的Form组件 | WrappedFormUtils | - | ||
| name | 填充输入框显示的表单字段属性名，表单受控 | string | |||
| placeholder | 选择框默认文字 | string | - | ||
| reader | 接口数据解析适配，参考配置项 | object | - | ||
| rowKey | 设置列表项唯一的 key，可以是返回字符串的字符串或函数 | Function((item: T) => string) | string | 'id' | |
| style | css 属性配置 | React.CSSProperties | - | ||
| showSearch | 显示快速搜索 | boolean | true | ||
| searchPlaceHolder | 搜索框默认文字 | string | - | ||
| searchProperties | 搜索接口数据属性配置 | string[] | ['code', 'name'] | ||
| store | 数据接口对象,参考配置项 | object | - | ||
| value | 输入框内容 | string | - | ||
| width | 数据面板宽度,默认与选择框同宽 | number | - |
StoreProps
- dataSource 用来配置本地数据，store用来配置远程数据请求信息。
- dataPath 用于后端渲染下拉树的数据节点,默认读取response（后端响应数据中的'data'属性）。你也可配置成'data.content', 表示读取返回数据中data中的content作为下拉树渲染内容。
| 参数 | 说明 | 类型 | 默认值 | 版本 |
|---|---|---|---|---|
| params | 接口请求参数 | object | - | |
| type | 接口请求类型 | 'GET' | 'POST' | GET | |
| url | 接口请求地址 | string | - | |
| autoLoad | 初始化时自动获取数据 | boolean | false | |
| dataPath | 用于渲染数据路径 | string | 'data' |
Reader
| 参数 | 说明 | 类型 | 默认值 | 版本 |
|---|---|---|---|---|
| childKey | 子节点的属性名 | string | 'children' | |
| field | 与dataSource树状节点属性对应，form表单提交时候将获取额外属性 | string[] | - | |
| name | 对应节点key | string | - |