React components for efficiently rendering large lists and tabular data
React Virtualized helps to efficiently render large lists and tabular data by only rendering items that are visible.
Useful links:
Questions tagged [react-virtualized]
525 questions
4
votes
1 answer
Vertical scrollbar visibility in react-virtualized table
When using react-virtualized's Table class with a table with many columns, it is necessary to scroll horizontally to the very end of the columns in order to be able to see the vertical scrollbar.
(you can see an extremely similar question about…
dWitty
- 494
- 9
- 22
4
votes
1 answer
How do I scroll to a row in a list of rows using React?
I was using React-virtualized table and it has a very useful prop called scrollToIndex that was doing the job.
However, I had to get rid of the library and use my own JSX.
Now I have a big list of projects as follows:-
render() {
…
Ziko
- 919
- 2
- 10
- 22
4
votes
0 answers
How do detect end of scrolling event in react-virtualized?
Is it possible (if yes - how) to detect end of scrolling event in react-virtualized if Grid.state.scrollPositionChangeReason = 'requested' ?
It is easy to detect end of scrolling event if Grid.state.scrollPositionChangeReason = 'observed', because…
captain-yossarian from Ukraine
- 31,174
- 3
- 30
- 62
4
votes
1 answer
React Virtualized Auto Scroll Issue
I am using react-virtualized v-9.21.2 to display a list, I am having an issue on insertion of a new item, upon inserting a new item to the list I am clearing the cache and updating the listkey to auto resize the height, otherwise, the new added item…
Ahmed Imam
- 1,315
- 2
- 19
- 42
4
votes
2 answers
Prevent FlatList re-rendering causing performance problems
I'm building a React Native App using Hooks and ES6.
The Home screen fetches some data from API and display it as image galleries.
The Home screen is the parent component which includes a slideshow gallery and a Flatlist as children.
1) Slideshow -…
Butri
- 339
- 8
- 22
4
votes
1 answer
react-window fixedSizeGrid with react-window-infinite-loader
I tried to use react-window's fixedSizeGrid with react-infinite-loader. As mentioned it's issue, infinite-loader does not support fixedSizeGrid for the infinite load. So i found onItemsRendered override method. Now i am trying to render data with it…
Zorig
- 585
- 1
- 10
- 26
4
votes
0 answers
React-virtualized AutoSizer - cannot set ref
Trying to set ref to use it in component method, but it's not defined. If I move ref definition outside AutoSizer, then it works without issues.
this ref CAN be access in component's method
…
Anton
- 1,898
- 3
- 18
- 27
4
votes
1 answer
How add horizontal scrollbar to table in react-virtualized (CodeSandBox)
In this table I want to add some colums with widths. If columns are more width than page, the horizontal scrollbar doesn't show.
How to remake example from sandbox and add horizontal scrollbar? Is to possible doing this by Table…
Peter
- 499
- 10
- 30
4
votes
1 answer
React Virtualized table with CellMeasurer is not calculating the height properly
I have a strange issue going on. The react-virtualized table with CellMeasurer is not calculating the height properly.
My render function looks something like this :-
arb
- 7,753
- 7
- 31
- 66
4
votes
1 answer
Resetting row heights causes incorrect row offset to get calculated
Inside of an InfiniteLoader I have a List, whose rowRenderer callback creates a
wrapped by CellMeasurer (I'm also using a cache for that). The rows can vary wildly in size, but this setup is working well for scrolling purposes.
However,…
Javier Pedemonte
- 151
- 1
- 8
4
votes
1 answer
Using react-sortable-hoc with react-virtualized Grid
I want to use react-sortable-hoc with react-virtualized's Grid where the rows are sortable. I cannot use the List as I have multiple columns and I cannot use it with the Table because I have too many columns and therefore need horizontal…
kraenhansen
- 1,535
- 2
- 15
- 26