notes
This package with fixed a problem.
rc-table
react table component
install
Development
npm install
npm start
Example
http://localhost:8000/examples/
online example: http://react-component.github.io/table/examples/
Usage
var React = ;var Table = ;; var columns = title: '表头1' dataIndex: 'a' colSpan: 2key:'a'width: 100 id: '123' title: '表头2' dataIndex: 'b' colSpan: 0key:'b' width: 100 { let obj = children:o props:{} ifindex === 0 objpropsrowSpan = 2; ifindex === 1 objpropsrowSpan = 0; return obj; } title: '表头3' dataIndex: 'c' key:'c'width: 200 title: '操作' dataIndex: '' key:'d' { return <a href="#">操作</a> } ; var data = a: '123'key:'1' a: 'cdd' b: 'edd'key:'2' a: '1333' c: 'eee' d: 2key:'3'; var table = React;
API
property
name | type | default | description | ||||||||||||||||||||||||||||||||
---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|
prefixCls | String | rc-table | |||||||||||||||||||||||||||||||||
className | String | additional className | |||||||||||||||||||||||||||||||||
colSpan | Number | thead colSpan of this column | |||||||||||||||||||||||||||||||||
useFixedHeader | Boolean | false | whether use separator table for header. better set width for columns | ||||||||||||||||||||||||||||||||
scroll | Object | {x: false, y: false} | whether table can be scroll in x/y direction, `x` or `y` can be a number that indicated the width and height of table body | ||||||||||||||||||||||||||||||||
expandIconAsCell | Boolean | false | whether render expandIcon as a cell | ||||||||||||||||||||||||||||||||
expandIconColumnIndex | Number | 0 | The index of expandIcon which column will be inserted when expandIconAsCell is false | ||||||||||||||||||||||||||||||||
rowKey | Function(recode,index):string | record.key | default use record.key as rowKey | ||||||||||||||||||||||||||||||||
rowClassName | Function(recode,index):string | get row's className | |||||||||||||||||||||||||||||||||
rowRef | Function(record,index):string | get row's ref key | |||||||||||||||||||||||||||||||||
defaultExpandedRowKeys | String[] | [] | initial expanded rows keys | ||||||||||||||||||||||||||||||||
expandedRowKeys | String[] | current expanded rows keys | |||||||||||||||||||||||||||||||||
defaultExpandAllRows | Boolean | false | Expand All Rows initially | ||||||||||||||||||||||||||||||||
onExpandedRowsChange | Function(expandedRows) | save the expanded rows in the internal state | function to call when the expanded rows change | ||||||||||||||||||||||||||||||||
onExpand | Function(expanded, record) | function to call when click expand icon | |||||||||||||||||||||||||||||||||
expandedRowClassName | Function(recode,index):string | get expanded row's className | |||||||||||||||||||||||||||||||||
data | Object[] | data record array to be rendered | |||||||||||||||||||||||||||||||||
indentSize | Number | 15 | indentSize for every level of data.i.children, better using with column.width specified | ||||||||||||||||||||||||||||||||
onRowClick | Function(record, index) | handle rowClick action, index means the index of current row among fatherElement[childrenColumnName] | |||||||||||||||||||||||||||||||||
columnsPageSize | Number | 5 | pageSize of columns. (Deprecated, use fixed columns) | ||||||||||||||||||||||||||||||||
columnsPageRange | Array | columns index range need paging, like [2,10]. (Deprecated, use column.fixed) | |||||||||||||||||||||||||||||||||
showHeader | Boolean | true | whether table head is shown | ||||||||||||||||||||||||||||||||
footer | Function(currentData) | table footer render function | |||||||||||||||||||||||||||||||||
columns | Object[] |
The columns config of table. contains
|
Test Case
http://localhost:8000/tests/runner.html?coverage
Coverage
License
rc-table is released under the MIT license.