Installations

npm install rc-virtual-list-modern

Developer Guide

BETA

Typescript

Yes

Module System

CommonJS

Min. Node Version

>=8.x

Node Version

20.11.1

NPM Version

10.2.4 Pull Requests

Open

27

Total

230

Closed

102

Merged

101

Issues

Open

50

Total

72

Closed

22

Releases

132

v3.17.1

Published on 18 Jan 2025

v3.17.0

Published on 03 Jan 2025

v3.16.1

Published on 16 Dec 2024

v3.16.0

Published on 05 Dec 2024

v3.15.0

Published on 05 Nov 2024

v3.14.8

Published on 26 Sept 2024

View all 132 releases

Contributors

42

View all 42 contributors

Languages

2

TypeScript

JavaScript

TypeScript (61.55%)

JavaScript (38.45%)

Developer

react-component

Download Statistics

Total Downloads

479

Last Day

1

Last Week

8

Last Month

13

Last Year

479

GitHub Statistics

748 Stars

332 Commits

161 Forks

6 Watching

13 Branches

42 Contributors

Bundle Size

19.70 kB

Minified

7.43 kB

Minified + Gzipped

Bundlephobia

Maintainers

1

Package Meta Information

Latest Version

3.14.2

Package Id

rc-virtual-list-modern@3.14.2

Unpacked Size

112.88 kB

Size

19.64 kB

File Count

79

NPM Version

10.2.4

Node Version

20.11.1

Publised On

30 May 2024

Total Downloads

Cumulative downloads

Total Downloads

479

Last day

0%

1

Compared to previous day

Last week

0%

8

Compared to previous week

Last month

85.7%

13

Compared to previous month

Last year

0%

479

Compared to previous year

Daily Downloads

Weekly Downloads

Monthly Downloads

Yearly Downloads

Dependencies

4

@babel/runtime classnames rc-resize-observer rc-util

Peer Dependencies

2

react react-dom

Dev Dependencies

23

Versions

rc-virtual-list

React Virtual List Component which worked with animation.

Online Preview

https://virtual-list-react-component.vercel.app/

Development

1npm install
2npm start
3open http://localhost:9001/

Feature

Support react.js
Support animation
Support IE11+

Install

Usage

1import List from 'rc-virtual-list';
2
3<List data={[0, 1, 2]} height={200} itemHeight={30} itemKey="id">
4  {index => <div>{index}</div>}
5</List>;

API

List

Prop	Description	Type	Default
children	Render props of item	(item, index, props) => ReactElement	-
component	Customize List dom element	string \| Component	div
data	Data list	Array	-
disabled	Disable scroll check. Usually used on animation control	boolean	false
height	List height	number	-
itemHeight	Item minium height	number	-
itemKey	Match key with item	string	-
styles	style	{ horizontalScrollBar?: React.CSSProperties; horizontalScrollBarThumb?: React.CSSProperties; verticalScrollBar?: React.CSSProperties; verticalScrollBarThumb?: React.CSSProperties; }	-

children provides additional props argument to support IE 11 scroll shaking. It will set style to visibility: hidden when measuring. You can ignore this if no requirement on IE.

Security-Policy

Determines if the project has published a security policy.

0

Branch-Protection

Determines if the default and release branches are protected with GitHub's branch protection settings.

Score

5.2

/10

Last Scanned on 2025-01-27

The Open Source Security Foundation is a cross-industry collaboration to improve the security of open source software (OSS). The Scorecard provides security health metrics for open source projects.

Learn More