1.0.2 • Published 3 years ago
@tntx/entry-lines v1.0.2
EntryLines 多行数据录入
以数据驱动的、可以在一行内渲染多个(Antd3)Input、Select、字符、甚至自定义dom，并渲染多个上述行的组件。提供联动、交互功能
安装、发布与源码
安装：npm i @tntx/entry-lines
发布：https://www.npmjs.com/package/@tntx/entry-lines
源码：https://github.com/YuDGang/entry-lines-react/tree/master/src/components/EntryLines
更新日志
- 1.0.0 数据驱动的EntryLines发布;
API
| 参数 | 说明 | 类型 |
|---|---|---|
| columns | EntryLines的配置描述，具体项见下表 | ColumnProps[] |
| data | 数据数组 | any[] |
| disabled | 数据框的禁用状态 | boolean |
| onDataChange | 数据改变时触发的回调，参数1为完整的data，请确保此函数正确的改变了data，以保证组件及时更新 | Function(data) |
| footer | 底部额外的Node | ReactNode(operateCallback) |
Columns
| 参数 | 说明 | 类型 |
|---|---|---|
| type | 输入控件的类型，可选'input'、'inputNumber'、'select' | string |
| dataIndex | 输入控件数据在数据项中对应的 key | string |
| visible | 可见性 | boolean | Function(source, record)) |
| render | 渲染自定义Node | ReactNode |
| operateRender | 渲染操作类型的自定义Node，参数中附带了对数据的操作回调 | ReactNode(record, operateCallback) |
| colSpan | 栅格占位格数, 共24格 | number |
| options | Select.Option控件的选项数组，当type为select时，此为必填项 | array{title: , value: } |
何时使用
需要渲染每一行由可以互相联动的输入框、字符等并排构成，且同时存在多个类似的多个行时。
如何使用
由数据驱动，data改变，则组件重新渲染。