A spreadsheet component for React
- Table cell editing
- Data pasting from table editing applications e.g. Numbers
- Multi-cell selecting / copying / cutting / pasting
- Arrow key selecting
- Auto-filling via dragging
- Row / column inserting / deleting
- Data sorting A-Z / Z-A
- Row-column switching
The package can be installed via NPM:
npm install sou-react-table --save
You'll need to install React and ReactDOM separately since they are not included in the package.
SouTable
can be used as below
import SouTable from 'sou-react-table';
import 'sou-react-table/SouTable.css';
<SouTable
tableData = [
{ 'City', 'Beijing', 'Shanghai', 'Guangzhou' },
{ 'Temperature', '5', '22', '29' },
{ 'Weather', 'Windy', 'Sunny', 'Rainy' },
]
minTableCol = 10
minTableRow = 21
getData = function getData(data) {
console.log(data);
}
/>
type: array
of arrays
Each column of the table data should be put into a child array.
tableData
can be an empty array
.
type: number
The minimum number of columns of the table.
type: number
The minimum number of rows of the table.
type: function
Callback function getData
is executed when table data changes. The changed table data will be passed as the parameter.
Welcome all contributions. You can submit any ideas as pull requests or as GitHub issues.
Copyright (c) 2017 Mia Wang. Licensed under MIT license, see LICENSE for the full license.