0

I'm using an InfiniteLoader with a Table and I have the indices of some entries that match a specific criteria stored in state. If the user would want to go through those entries, I would have to pass down to the Table each index (following a button click) and use it in scrollToIndex. However, after it's passed down, I would have to make it null again, otherwise if the user were to scroll up/down the Table, he would always end to the same index specified by scrollToIndex instead of the current scroll position.

Is there a better way to do that, other than setting the state twice, once with an index and then with a null value?

Hope my question is clear.

XeniaSis
  • 2,192
  • 5
  • 24
  • 39

1 Answers1

2

Table (and Grid and List) also have public methods for setting a 1-time scroll index. For Table the method is scrollToRow and you just pass it the index you want to scroll to. Maybe that would be more to your liking?

Edit: In response to the follow-up question of how you get a reference to Table if you also need to pass it to InfiniteLoader:

<InfiniteLoader {...infiniteLoaderProps}>
  {({ onRowsRendered, registerChild }) => (
    <Table
      {...tableProps}
      onRowsRendered={onRowsRendered}
      ref={(ref) => {
        this._tableRef = ref     // Store for yourself
        registerChild(ref) // And pass on to InfiniteLoader
      }}
    >
      {/* Columns ... */}
    </Table>
  )}
</InfiniteLoader>
bvaughn
  • 13,300
  • 45
  • 46
  • How can I get a reference to the `Table` in order to call `scrollToRow` if I have to pass it `InfiniteLoader`'s `registerChild` as a `ref`? – XeniaSis Mar 01 '17 at 17:35
  • You can stack refs. I have updated my answer to illustrate this. – bvaughn Mar 01 '17 at 17:48