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
0
votes
1 answer
React-virtualized - Is it possible to update rowHeights on window resize?
I am using React-virtualized to render a large infinite list of posts for a social media web app i am making for fun. The CellMeasurer is used to allow for dynamic rowHeights, it works if the window is kept the same size.
I tried to follow the docs…
anolan23
- 443
- 3
- 12
0
votes
1 answer
making a virtualized list with a separate file in react
I created a to do list app in app.js and a virtualized list in VirtualizedList.js but none of the virtualized list code is displaying although I imported it into app.js properly.
Here is the VirtualizedList.js code.
import React from 'react';
import…
student
- 1
- 1
0
votes
1 answer
Display chat messages from bottom to top
I'm developing a chat with the messages virtualized. It works well as a normal list.
Now I'm trying to "style" the messages to go from bottom up (like Whatsapp, Telegram and every message app works).
I have included a display: flex, a…
W. Lucas
- 23
- 1
- 6
0
votes
0 answers
is there any example to make rows in React-virtualized Table(not list) draggable and droppable with React-beautiful-dnd lib?
tried all the methods mention in React-beautiful-dnd lib to make work with virtual list but can't make it work with React-virtualized-table.
Darshak patel
- 19
- 3
0
votes
1 answer
react-virtualized: SetState in AutoSizer
I am using React-Virtualized.
I would like to setState of AutoSizer width but it gives me warning.
Warning: Cannot update a component (`App`) while rendering a different component (`AutoSizer`). To locate the bad setState() call inside `AutoSizer`,…
Theo Cerutti
- 779
- 1
- 10
- 33
0
votes
0 answers
react virtualize table - have bad performance
I am using react virtualize table with many sub components in it and have very bad performance when rendering it.
it gets more aweful after scrolling, clicking buttons...
{({ height,…
dush
- 1
- 3
0
votes
1 answer
React Virtualised trouble understanding overscanIndicesGetter
I'm currently using React Virtualised to virtualise a list. The caveat of this, is that my list is actually a grid layout, my component return statement looks like the below:
So the list actually ends up rendering a grid format. screenshot below…
Squiggs.
- 4,299
- 6
- 49
- 89
0
votes
0 answers
Does document fragment take same memory as a dom element?
I have a page with a lot of components like charts and tables and I want to cache them by rendering them on a document fragment so that I can attach and detach the fragment to the real dom when it's in the viewport. Will it take the same memory as…
Rohan
- 257
- 1
- 4
- 13
0
votes
1 answer
React Virtualized CellMeasurer with List gives random height intermittently
I am facing an issue with react-virtualized that when I try to render List along with CellMeasurer having items with dynamic heights and I scroll through the list the heights are getting incorrectly calculated intermittently (sometimes they are…
Shubham Jain
- 930
- 1
- 14
- 24
0
votes
1 answer
How to make fixed columns dynamic using react-virtualized library
Using this library https://bvaughn.github.io/react-virtualized/#/components/MultiGrid
I created multiGrid like this:
chethan
- 115
- 10
0
votes
1 answer
How to measure cell size in react virtualized table
I'm trying to do autosized cell in react-virtualized Table.
Here is the table:
{({ height, width }) => (
