Question

我正在尝试将自定义CSS表与react虚拟化窗口滚动器结合使用。我目前可以显示表格，但是我无法弄清楚如何将样式与表格相结合，或者向表格行添加任何逻辑。

 <WindowScroller>
    {({ height, isScrolling, onChildScroll, scrollTop }) => (

      <Table
        autoHeight
        width={1000}
        height={700}
        headerHeight={20}
        rowHeight={30}
        isScrolling={isScrolling}
        onScroll={onChildScroll}
        rowCount={table.length}
        scrollTop={scrollTop}
        rowGetter={({ index }) => table[index]}
      >
        <Column
          label='Item1'
          dataKey='item1'
          width={150}
        />
        <Column
          width={200}
          label='item2'
          dataKey='item2'
        />
        <Column
          width={200}
          label='item3'
          dataKey='item3'
        />
        <Column
          width={150}
          label='item4'
          dataKey='item4'
        />
        <Column
          width={200}
          label='item5'
          dataKey='item5'
        />
      </Table>

    )}
  </WindowScroller>

Answer 1

绝对查看文档。您可能会将某些类型的style道具和event道具传递给组件 - 因此您需要了解这些组件如何定义和接受这些道具。只有通过查看库的文档才能实现。

编辑：

以下是<Table />组件的propTypes：

https://github.com/bvaughn/react-virtualized/blob/master/docs/Table.md

您会看到它接受onRowClick之类的自定义事件处理程序，但也会接受像rowStyle

这样的样式道具

React Virtualized结合自定义表和Window Scroller

1 个答案: