Skip to content

huiery/react-field-mapping

 
 

Folders and files

NameName
Last commit message
Last commit date

Latest commit

 

History

43 Commits
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 

Repository files navigation

react-field-mapping

npm version download gzip size license

基于react的表字段映射组件

View the Demo and its source for more.

API

FieldMapping

参数 说明 类型 默认值
className 自定义class string ""
style 自定义style object {}
source data 源表数据(受控) array []
columns 表格列的配置描述,具体项见下表 ColumnProps[] []
onChange 表数据change监听,目前只有sort会触发,且开启sort时必须同步源表数据后,sort才会生效 function (sourceData) => {}
target data 目标表数据(受控) array []
columns 表格列的配置描述,具体项见下表 ColumnProps[] []
onChange 表数据change监听,目前只有sort会触发,且开启sort时必须同步目标表数据后,sort才会生效 function (sourceData) => {}
isSort 是否开启字段排序 boolean true
relation 默认已映射数据 array[{source:{name,type}, target:{name,type}}] []
onChange 关联变化监听 function(relation) -
onDrawStart 开始关联监听 function(source, relation) -
onDrawing 关联进行中监听 object -
onDrawEnd 关联结束监听 function(source, relation) -

Column

列描述数据对象,是 columns 中的一项,Column 使用相同的 API。
参数 说明 类型 默认值
align 设置列的对齐方式 'left' | 'right' | 'center' ‘left
key 列数据在数据项中对应的 key string
render 生成复杂数据的渲染函数,参数分别为当前行的值 Function(text, record, index) {} | string | Element
title 列头显示文字 string
width 列宽度 string '100px'

About

基于React表字段映射关系组件

Resources

License

Stars

Watchers

Forks

Packages

No packages published

Languages

  • JavaScript 89.0%
  • CSS 9.3%
  • HTML 1.7%