React开源:sou-react-table - React Excel 控件

DiegoKleibe 8年前
   <h2>Sou React Table</h2>    <p>A spreadsheet component for React</p>    <p style="text-align:center"><img src="https://simg.open-open.com/show/51ed6f64cf266e2404c486d4d83f146b.png"></p>    <h2>Features</h2>    <ul>     <li>Table cell editing</li>     <li>Data pasting from table editing applications e.g. <strong>Numbers</strong></li>     <li>Multi-cell selecting / copying / cutting / pasting</li>     <li>Arrow key selecting</li>     <li>Auto-filling via dragging</li>     <li>Row / column inserting / deleting</li>     <li>Data sorting A-Z / Z-A</li>     <li>Row-column switching</li>    </ul>    <h2>Installation</h2>    <p>The package can be installed via NPM:</p>    <pre>  <code class="language-javascript">npm install sou-react-table --save</code></pre>    <p>You’ll need to install React and ReactDOM separately since they are not included in the package.</p>    <h2>Usage</h2>    <p>SouTable can be used as below</p>    <pre>  <code class="language-javascript">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);    }  />  </code></pre>    <h3>tableData</h3>    <p>type: array of arrays</p>    <p>Each column of the table data should be put into a child array. tableData can be an empty array .</p>    <h3>minTableCol</h3>    <p>type: number</p>    <p>The minimum number of columns of the table.</p>    <h3>minTableRow</h3>    <p>type: number</p>    <p>The minimum number of rows of the table.</p>    <h3>getData</h3>    <p>type: function</p>    <p>Callback function getData is executed when table data changes. The changed table data will be passed as the parameter.</p>    <h2>Contributing</h2>    <p>Welcome all contributions. You can submit any ideas as <a href="/misc/goto?guid=4959739917718465020" rel="nofollow,noindex">pull requests</a> or as <a href="/misc/goto?guid=4959739917810485706" rel="nofollow,noindex">GitHub issues</a> .</p>    <h2>License</h2>    <p>Copyright (c) 2017 Mia Wang. Licensed under MIT license, seeLICENSE for the full license.</p>    <p> </p>    <p> </p>    <p> </p>