Lucas lucassshanks
lucassshanks
/ ReactWindowPerformanceExample.ts
Created
November 14, 2024 08:59
Use react-window to limit the amount of items rendered in the dom in TS. The onHover will lag due to how react-select computes whether an element should be highlighted or not so a CSS solution is needed to solve this. Also included some example of data fetching. Designed for https://github.com/JedWatson/react-select/issues/3128
This file contains hidden or bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
| import React, { useEffect, useState } from 'react' | |
| import ReactSelect, { createFilter, MenuListProps, OptionProps } from 'react-select' | |
| import { FixedSizeList as List, ListChildComponentProps } from 'react-window' | |
| type OptionType = { | |
| label: string | |
| value: string | |
| } | |
| export const ReactWindowSelectExample = () => { |