Stack Overflow
Stack Overflow

Questions tagged [react-window]

133 questions
0
votes
1 answer

react-window giving a class to innermost div

I can't find how to give a class to innermost div in react-window. In my case a have a flex wrapper containing list of data divs. But because react-window's innermost div separates my wrapper and list items I cannot properly align my list items. Is…
klevendoglu
  • 592
  • 1
  • 6
  • 18
0
votes
1 answer

onSectionRendered in react-window

In react-virtualized, there is a prop called "onSectionRendered" to define a function which will be called after cells have been rendered. What way is there to achieve this with react-window?
user3601578
  • 1,310
  • 1
  • 18
  • 29
0
votes
2 answers

react-window rows call useState

I'm trying to render a stateful component inside react-window rows (using FixedSizeList), but their state (useState) is not maintained when they get re-rendered so it resets every time I scroll back to them. This makes sense because they're getting…
Zip184
  • 1,792
  • 2
  • 21
  • 34
0
votes
0 answers

At what point does it make sense to start using virtualization to render data?

I'm using React to build a simple website and I often hear people say that they use virtualization to render lists of items (eg. products on a retail website). When I ask them why they use it they say that they can more efficiently render large…
PlsWork
  • 1,958
  • 1
  • 19
  • 31
0
votes
1 answer

Clear cache of react-window list that is used with react-window-infinite-loader on resize of browser window

I am using VariableSizedList along with the InfiniteLoader and AutoSizer in the following manner {({ width, height }) => (
Saurav Seth
  • 301
  • 3
  • 9
0
votes
1 answer

The sort direction is reset when the data drawn by react-window is updated

Achievement goal Draw a large amount of data on the table Sticky header (scroll only the body) Sortable by clicking the cell in the header The data in that row can be updated by pressing the button Example code (Minimal…
Nichons
  • 11
  • 1
0
votes
1 answer

Windowing with Antd in Next.js breaks tooltips and popovers

I'm experimenting with the windowing technique in Next.js with Antd, and I made this simple app that has this index.tsx page: import { CSSProperties } from 'react' import type { NextPage } from 'next' import Head from 'next/head' import Image from…
user2921009
  • 711
  • 1
  • 10
  • 21
0
votes
1 answer

After successfully adding data, upon scrolling an item was removed

I am using react-table with react-window-infinite-loader and react-window for infinite scrolling. Initially the table has 20 items(data) on fetch from API. After adding a new data into my table it will successfully update(thru redux) and the data…
Darwin Arugay
  • 1
  • 2
0
votes
1 answer

Can't resolve @babel/runtime/helpers/esm* in react-window

I'm using the react-window ^1.8.6 version ( under my dependencies). When I try to yarn build my project, I'm getting the following errors. ERROR in ./node_modules/react-window/dist/index.esm.js Module not found: Error: Can't resolve…
Milindu Sanoj Kumarage
  • 2,714
  • 2
  • 31
  • 54
0
votes
0 answers

Rendering Huge List in React using Intersection Observer

I am trying to render a huge list of data in React. I know I can use react-window for this usecase but wanted to try if we can implement a similar window based rendering using Intersection Observer API. I have written this component to try the same.…
Md Sultan Altamash Ali
  • 26
  • 4
0
votes
0 answers

MUI 5 with react-window for Autocomplete component with multiline texts labels

I'm using MUI 5 Autocomplete component with a long list for the options property Because I got some delay between the time the user clicked on the select and the time the list was open I'm trying to add the "react-window" VariableSizeList to the…
Ar26
  • 949
  • 1
  • 12
  • 29
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

Having trouble with radio buttons forgetting its state when using React-Window

I have follow a couple of examples using react-table and react-window so far so good, but I need the table to have select boxes to select individual or grouped rows as well as a radio-like button to be able to toggle information for a row, I manage…
Ricardo Sanchez
  • 4,935
  • 11
  • 56
  • 86
0
votes
1 answer

Checkbox input not displaying properly in conjunction with React-Table & React-Window combo

I am trying to combine the Row Selection and Virtualized Rows examples from React-table but the checkboxes don't render properly, the problem is that when you click on them you can see they activate but the tick mark does not appear until you scroll…
Ricardo Sanchez
  • 4,935
  • 11
  • 56
  • 86
0
votes
1 answer

Is possible to use react-window for displaying a list of items with buttons?

I need to know if it's possible to use react-window to display a list of items and in the same row show buttons with actions for each. If yes, please give me a hint on how to do it. import React from "react"; import { FixedSizeList as List } from…
carlos
  • 1
  • 3
1 2 3
…
8
9