In this PR, I added infinite scroller feature to rc-table.

You can check this page to see what would the feature look like.

There is also another example using placeholders to improve the overall rendering performance.

Details

An optional prop containing the following fields called virtualized is added to configure the infinite scroller feature:

name	type	required	usage
renderNumber	int	yes	how many rows to render
redundantNumber	int	yes	how many redundant rows to render before and after the screen as buffer zone
bodyHeight	int	yes	height of the table body
placeholder	reactNode	no	placeholder to show when the user is scrolling at a fast speed to improve the rendering performance when the row content is too complex
loadMoreThreshold	int	no	when to load next batch of data(for example: If 600 existing rows were rendered currently, then next batch of data is to be fetched after the user scolls to the 600-loadMoreThreshold rows)
loadMore	function	no	callback to be invoked when more data is ought to be fetched
loadingMore	bool	no	whether or not more data is being fetched
loadingIndicator	reactNode	no	Indicator to be rendered at the end of the table telling the user more data is about to come

Compatibility

Backward compatible, when virtualized prop is empty, the behavior is the same as the original version of rc-table.
No break change.
All unit test passed.
All lint passed.

Aug 20 '18 01:08 lo-tp

Codecov Report

Merging #231 into master will decrease coverage by 0.70%. The diff coverage is 68.00%.

@@            Coverage Diff             @@
##           master     #231      +/-   ##
==========================================
- Coverage   93.38%   92.68%   -0.71%     
==========================================
  Files          17       17              
  Lines         726      670      -56     
  Branches      208      197      -11     
==========================================
- Hits          678      621      -57     
- Misses         40       41       +1     
  Partials        8        8

Impacted Files	Coverage Δ
src/BodyTable.js	`85.71% <50.00%> (-8.74%)`	:arrow_down:
src/TableRow.js	`90.09% <55.55%> (+4.11%)`	:arrow_up:
src/Table.js	`85.71% <57.89%> (-0.68%)`	:arrow_down:
src/BaseTable.js	`97.10% <84.61%> (-2.90%)`	:arrow_down:
src/TableCell.js	`96.22% <87.50%> (-1.60%)`	:arrow_down:
src/ColumnManager.js	`100.00% <100.00%> (+1.20%)`	:arrow_up:
src/TableHeaderRow.js	`97.05% <100.00%> (+0.08%)`	:arrow_up:

Continue to review full report at Codecov.

Legend - Click here to learn more Δ = absolute <relative> (impact), ø = not affected, ? = missing data Powered by Codecov. Last update cd5ad56...4b3a83b. Read the comment docs.