Questions tagged [react-virtuoso]

Use the tag to mark questions related to the react-virtuoso React library.

react-virtuoso is a React library to render virtual lists. Its main attractive feature is to render variable sized items out of the box, no manual measurements or hard-coding item heights is necessary. It also includes grouped mode with sticky headers, responsive virtualized grids, and virtualized tables.

See this comparison here between react-virtuoso and existing projects such as or

25 questions
0
votes
0 answers

Fixed List header with React Virtuoso

We can add a custom header to the list by using the components property of React virtuoso. (Link) But can the header also be configured to be fixed? (always at the top of the scroll container) How? This feature seems to exist for tables, but I need…
Page not found
  • 2,454
  • 2
  • 10
  • 19
0
votes
1 answer

How to get current `topMostItemindex` for `react-virtuoso`?

I want to persist the scroll position of my list through unmounts/remounts. I think I want to use the initialTopMostItemIndex property to restore my previous scroll position in order to achieve this - this post makes me believe this is…
Michal Kurz
  • 1,592
  • 13
  • 41
0
votes
0 answers

How can I create a table-like component using VirtuosoGrid in React with CSS grid?

I'm trying to create a table-like component in React using the VirtuosoGrid component and CSS grid. However, the component only renders the first record and I'm not sure how to fix it. I understand that I should be using the VirtuosoTable component…
0
votes
0 answers

MUI Autocomplete + React-Virtuoso

I'm adding virtualisation to the Material-UI Autocomplete component and using react-virtuoso to handle the virtualisation. I've followed the example provided in the MUI documentation page, which uses react-window and managed to implement it almost…
user3998446
  • 27
  • 1
  • 5
0
votes
0 answers

Is there any way to implement virtualization to react-sortablejs

I am trying to implement virtualization with react-sortablejs for lists with more than 500 items. I have tried with react-virtuoso, but react-sortablejs wraps the entire react-virtuoso component as a single item. Is there any way to target the li…
0
votes
0 answers

Using the react-virtuoso TableVirtuoso component how do I print the entire table?

When I print a page containing a TableVirtuoso component, I only get the portion of the table that is visible. How do I instruct TableVirtuoso to render the entire table in prep for printing?
Glenn
  • 1,996
  • 2
  • 24
  • 32
0
votes
1 answer

Make a momentary highlight inside a virtualized list when render is not triggered

I have an extensive list of items in an application, so it is rendered using a virtual list provided by react-virtuoso. The content of the list itself changes based on API calls made by a separate component. What I am trying to achieve is whenever a…
user2921009
  • 711
  • 1
  • 10
  • 21
0
votes
0 answers

How do I handle rendering errors in react-virtuoso?

I'm trying to harden a component that uses react-virtuoso against potentially janky data using error boundaries as the outer component for each item. But it seems that any error in the renderer will blow up the entire Virtuoso instance:…
0
votes
0 answers

Having trouble integrating the React Virtuoso virtualization library into a React project with MUI components

I'm trying to integrate react-virtuoso's Virtuoso into my TypeScript web app's MUI Autocomplete dropdown menu popper in order to virtualize a list of checkable options. I tried using react-window's VariableSizeList at first but was having some…
0
votes
1 answer

react-virtuoso: overscan props does not work

I'm using react-virtuoso library to render a simple virtual list. The code is very straightforward. I pass this overscan props and expect the virtual list to render n items above and below the viewport but it's not working. The ExpensiveComponents…
NearHuscarl
  • 66,950
  • 18
  • 261
  • 230
1
2