react-virtualized的使用

​​react-virtualized github地址​​

1. 安装： yarn add react-virtualized 。
2. 在项目的入口文件导入样式文件（只导入一次即可）
3. 打开文档看看，你所用到的组件的文档，​​组件文档地址​​
4. 找到自己要的组件代码，复制
5. 分析代码

import 'react-virtualized/styles.css';

代码中详细说明：
需得注意，style是必要得属性，必须得给，要不会有问题。

const list = Array(100).fill('react')
/**
 * 渲染每行数据的方法
 * @param {*} param0 
 * @returns jsx
 */
function rowRenderer({
  key, // Unique key within array of rows key值，唯一值
  index, // Index of row within collection 索引
  isScrolling, // The List is currently being scrolled 当前项是否在滚动中
  isVisible, // This row is visible within the List (eg it is not an overscanned row) 当前项是list中是否可见
  style, // 重点属性，一定要给每一行数据添加样式，作用，指定每一行位置。
         // Style object to be applied to row (to position it)
}) {
  return (
    <div key={key} style={style}>
      {list[index]}
    </div>
  );
}

<List
          width={300} //宽
          height={300} // 高
          rowCount={list.length} // 多少行
          rowHeight={20} // 行高
          rowRenderer={rowRenderer} // 每一行内容
        />