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
Add a 'serial number' column to react-virtualized material-ui table?
I'm trying to include an additional column showcasing the serial number for a react-virtualized table. lets take a simple table example. Also in case we are sorting this table, the serial number should not get reordered. any ideas?
PS: serial number…
Kombo
- 274
- 1
- 5
- 16
0
votes
1 answer
Changing format of Server-Side data inside react-virtualized table
I'm making a React app that has two view options:
cards and
lists (tables).
I'm using react-virtualized for the list-view option. The problem is that I need to change the format of the server-side data I get when the data type is number. I've…
Morgana
- 337
- 8
- 19
0
votes
1 answer
Example react-virtualized html page using CDN
I am unable to understand that how to use react-virtualized components like AutoSizer . Can anyone share react-virtualized CDN example . I am trying to create react page using CDN link.
Naresh Punna
- 109
- 1
- 1
- 10
0
votes
0 answers
Setting z-index and transform?
I'm working on an image gallery, when the user clicks on a photo in the gallery the photo will do a 3D animation to the center of the screen, something like this:
const style = this.state.expanded ? {
transform: 'translate3d(' +…
meds
- 21,699
- 37
- 163
- 314
0
votes
1 answer
To Add colors for column cell text based on conditions in react-virtualised table
I am using table & column components from react-virtualised module.
I have a requirement to add color to cell text based on few conditions. I did not find a way to do so.
This is the Link for code reference
Please help me for solution
user8599269
- 241
- 1
- 11
0
votes
1 answer
How can i change property overflow?
I have this code
import React from 'react';
import { AutoSizer, List } from 'react-virtualized';
const ListItem= () => (
{({ width }) => (
- 4,697
- 1
- 30
- 31
Alex Montoya
0
votes
1 answer
Get all selected values from child component
I have rendered a component that has select dropdowns multiple times on a button click event.
class AppComponent extends React.Component {
constructor(props){
super(props);
this.state = {
numChildren: 0
}
this.onAddChild =…
Raghvendra Singh
- 33
- 4
0
votes
1 answer
react-virtualized Masonry: how to scroll to index programmatically?
I've tried
David Burson
- 2,947
- 7
- 32
- 55
0
votes
1 answer
Adding custom classes to react-virtualized grid
I'm trying to add some custom classes to a grid component in react, I want to add a class if the row is even, a class is the row is odd and also a class to the first first grid row
I've got both arguments working, if I comment one out the other…
Neil Kelsey
- 811
- 4
- 13
- 31
0
votes
1 answer
react-virtualized arrowkeystepper table
my problem is in ArrowKeyStepper. it’s not working for me. I try to pushing keybord buttons, but it doesn’t have any effect.
link to documentation here react-virtualized
Nickless
- 1
- 2
0
votes
0 answers
Animate scroll to loaded element
I'm using a List inside of InfiniteLoader. Is it possible to animate the scroll to a specific element that's been loaded?
I think the animation is important as it gives the list time to calculate the height of each row.
I've tried using…
Ian Warburton
- 15,170
- 23
- 107
- 189
0
votes
0 answers
React virtualized Infinite Scroll rendering aggregated data
I have an Infinite Loader List component which renders array of data. I needed to aggregate my data (grouped by days), so I made two levels array:
list = {
[
{
group:'09-20',
data: [
content: 'content',
…
papryk
- 442
- 4
- 14
0
votes
0 answers
Update react-virtualized list when data in redux state gets updated
I have react-virtualized list that gets populated with data that comes from an API call which stores fetched data in the redux store. An action to begin fetching data from the API is dispatched when the component mounts, the data arrives and gets…
Dave Kalu
- 1,520
- 3
- 19
- 38
0
votes
1 answer
Mobx @computed called repeatedly even when returned value is the same object instance
I am using React Virtualized component and I have verified that removing this causes the unexpected behaviour to go away.
https://github.com/bvaughn/react-virtualized/blob/master/docs/AutoSizer.md
My @computed simply looks like…
Thoma S
- 11
- 2
0
votes
1 answer
How to scroll to bottom when props changed in react-virtualized?
I have component App with List from react-virtualized library.
And I need on initial render, that my List scroll to bottom.
And I did it, when added scrollToIndex option. But when I add new object in my list array, it does not scroll to my last…
Victor
- 745
- 2
- 7
- 16