非死book React 组件:fixed-data-table

gxw6 10年前

fixed-data-table 是一个用于以灵活且强有力的方式建立并显示数据的 React 组件。它支持标准的桌面特征,像头条、行、列、头条组、滚动列。此组件在处理数千行数据的时不会牺牲性能。平滑地滚定是 FixedDataTable 的首要目的,它的结构保证了它的灵活性和可扩展性。

示例代码:

var React = require('react');  var FixedDataTable = require('fixed-data-table');  var Table = FixedDataTable.Table;  var Column = FixedDataTable.Column;// Table data as a list of array.var rows = [    ['a1', 'b1', 'c1'],    ['a2', 'b3', 'c2'],    ['a3', 'b3', 'c3'],    ..... /// and more];function rowGetter(rowIndex) {  return rows[rowIndex];  }     React.render(  <Table      rowHeight={50}      rowGetter={rowGetter}      rowsCount={rows.length}      width={5000}      height={5000}      headerHeight={50}>      <Column        label="Col 1"        width={3000}        dataKey={0}      />      <Column        label="Col 2"        width={2000}        dataKey={1}      />    </Table>,  document.getElementById('example')  );

项目主页:http://www.open-open.com/lib/view/home/1430660677704