react-virtualized

import { List } from "react-virtualized";
import 'react-virtualized/styles.css'; // only needs to be imported on

    // 根据准确的测量每一行数据的高度，而不是默认的估算的高度
    this.ListRef.current.measureAllRows();
  // 虚拟化列表 - 计算大行的高度
  rowHeight = ({ index }) => {
    return 40 + this.state.cityListData[index].children.length * 40;
  };
  // 当行被渲染时
  onRowsRendered = ({ startIndex }) => {
  
  };
  // 创建 List 组件的 ref 关联
  ListRef = React.createRef();
       // 通过方法的方式改变列表滚动的索引，功能同组件的 scrollToIndex 属性
                this.ListRef.current.scrollToRow(index);
       <List
          width={window.screen.width}
          height={window.screen.height - 45}
          rowCount={this.state.cityListData.length}   // 大行的长度
          rowHeight={this.rowHeight}                  // 计算大行高度
          rowRenderer={this.rowRenderer}              // 大行渲染
          // scrollToIndex={this.state.activeIndex}      // 滚动到哪个索引
          scrollToAlignment="start"                   // 顶部对齐
          onRowsRendered={this.onRowsRendered}        // 当行被渲染时
          ref={this.ListRef}                          // 通过 ref 定位到 List 组件
        />