Stack Overflow
Stack Overflow

Questions tagged [react-window]

133 questions
4
votes
1 answer

Prevent DOM element re-render in virtualized tree component using react-window

I want to re implement a tree component to improve its performance. I used the FixedSizeList from react-window. Its working relatively well. It can handle even 100,000 tree node. My problem is, that I want to animate the little opening triangle of…
Peter Ambruzs
  • 7,763
  • 3
  • 30
  • 36
4
votes
1 answer

React Window How to Pass in Components?

I am trying to implement react-window but Ia m not sure how to pass in a component that takes in it's own properties If I have something like this { items.map( (item, index) => {
chobo2
  • 83,322
  • 195
  • 530
  • 832
3
votes
1 answer

react-window: How to use actual table tags

I want to use the semantic HTML tags (instead of using divs) to create a table with react-window. The problem is that List (FixedSizedList) creates two wrappers. The other one is called outerElementType and is also a prop to FixedSizedList with…
hellogoodnight
  • 1,989
  • 7
  • 29
  • 57
3
votes
0 answers

React-window grid: how to get the real index of an item instead of the current column's?

I'm using React-window - which is a more modern version of react-virtualized - to display a infinite list of images. It works very well with a classic list, but it freezes the ui when used as a grid. I suspect the reason is that react-window grid…
DoneDeal0
  • 5,273
  • 13
  • 55
  • 114
3
votes
0 answers

React window table resets while expanding a row

I am trying to attain an expandable row using react-window https://github.com/bvaughn/react-window following this sandbox - https://codesandbox.io/s/bvaughnreact-window-variable-size-list-vertical-forked-l10n7 This is what is I did -…
Niyas Nazar
  • 1,073
  • 13
  • 20
3
votes
1 answer

How to show the index the user is currently with react-window List + Infinte Loader

I came to this problem when I wanted to show my user at which point he/she was on the list when they were scrolling. In short, I wanted to have a counter indicating the current index of the visible Row. This can be achieved with…
GeorgeCodeHub
  • 131
  • 1
  • 10
3
votes
2 answers

React-window, how to prevent rerendering list on state change?

This my code sandbox example: https://codesandbox.io/s/react-hooks-counter-demo-kevxp?file=/src/index.js My problem is: The list will always rerendering on every state change inside the page so the scroll will always back to the top. I want to know…
My real name
  • 535
  • 1
  • 5
  • 17
3
votes
1 answer

react-table lost focus on filter?

I am making a table base on react-table v7 and react-window. I found other question on this site with the same question but almost they are using v6 - almost difference. Problem is the filter text field will lost focus after we type and even when we…
JayK
  • 141
  • 9
3
votes
0 answers

Custom scroll element in react-window

I would like to create virtualized list. I have 100 000 items, but only e. g. 20 items (depends on window height) will be rendered. When user scrolls, no new items will be added, it only changes the props to those that are off the screen. So user…
Michal
  • 1,755
  • 3
  • 21
  • 53
3
votes
0 answers

How to hide the vertical scrollbar only, but still allow scroll?

I have 2 scrollable elements ( from react-window) side by side, that are "synchronized": scrolling one will make the other scroll too. I would like to hide the vertical scrollbar of the left element so they appear as one single element, like a…
adnpwd
  • 101
  • 1
  • 10
3
votes
1 answer

Unable to select item when using TextField (or Select) with react-window

When using TextField component as a Select field with a large data set (1000 items), there is noticeable delay when mounting / unmounting the list. import React from 'react'; import MenuItem from '@material-ui/core/MenuItem'; import TextField from…
Robert Hung
  • 165
  • 13
3
votes
0 answers

How to deploy a heroku app containing a forked github repo

I have a Node app that is running on heroku. Now I want to make some changes to the package react-window that I'm using (the first time that I'm trying this) So I forked the react-window repo and replaced the original packgage using: yarn remove…
PeteMeier
  • 521
  • 1
  • 6
  • 18
2
votes
2 answers

react-window spacing between items list

I am trying to integrate react-window with react-window-infinite-loader and so far, I have been successful, but facing an issue where I couldn't find a way to style my list item to create more spacing between the list item. Here is my code…
Naruto
  • 53
  • 8
2
votes
1 answer

React-Window Calling RenderRow function infinitely

I have used react-window to render large list on UI. Not sure why it's calling the RenderRow function infinitely when I scroll and it's not able to render the pending rows when I am scrolling (showing me blank screen). Can anyone please tell me,…
Kelly
  • 131
  • 7
2
votes
1 answer

How to make react-window FixedSizeList scroll with the viewport instead of the component's scroll bar?

I am trying to integrate react-window's FixedSizeList and FixedSizeGrid components to increase the initial rendering speed of my page. Is there some way for me to let the user scroll down the react-window component using the viewport's scrolling…
dev
  • 43
  • 1
  • 6
1
2
3
…
8 9