反应虚拟化的箭头键步进表答案

【问题标题】：react-virtualized arrowkeystepper table反应虚拟化的箭头键步进表
【发布时间】：2019-03-09 20:47:40
【问题描述】：

我的问题出在 ArrowKeyStepper 中。它不适合我。我尝试按下键盘按钮，但没有任何效果。此处链接到文档react-virtualized

          <ArrowKeyStepper
            columnCount={1}
            rowCount={data.length}
            mode="cells"
          >
            {({ onSectionRendered, scrollToRow }) => {
              return (
                <Table
                  onRowsRendered={({ startIndex, stopIndex }) => {
                    onSectionRendered({
                      rowStartIndex: startIndex,
                      rowStopIndex: stopIndex
                    });
                  }}
                  scrollToRow={scrollToRow}
                  rowCount={data.length}
                  rowGetter={({ index }) => data[index]}
                >
                  // Column here
                </Table>
              );
            }}
          </ArrowKeyStepper>

我试图找到答案，但没有成功。

【问题讨论】：

欢迎来到 SO。您的问题不清楚，请详细描述您的问题并更新问题。
@Think-Twice 不工作 ArrowKeyStepper

标签： javascript reactjs react-virtualized

【解决方案1】：

使用 Table，您可以尝试使用 scrollToIndex，然后传递表格项的索引，而不是使用 ArrowKeyStepper。

const {index} = this.props
  return (
    <Table
      onRowsRendered={({ startIndex, stopIndex }) => {
        onSectionRendered({
          rowStartIndex: startIndex,
          rowStopIndex: stopIndex
        });
      }}
      scrollToRow={scrollToRow}
      rowCount={data.length}
      rowGetter={({ index }) => data[index]}
      scrollToIndex={index}
    >
      // Column here
    </Table>
 );

【讨论】：