'Material-UI Select: Prevent re-render after selection
In my project a user can choose an icon from 700 icons, the way I was supposed to make them choose is by using a select.
This is a screenshot from the mock-up: Mockup icon select.
So I made this:
<BootstrapSelect
displayEmpty
value={selectedIcon}
onChange={handleChange}
input={<OutlinedInput />}
IconComponent={KeyboardArrowDownIcon}
>
{iconsList.map((item,i) => {
let Ele = Icons[item];
return(
<MenuItem
key={item}
value={item}
>
<Ele />
{item}
</MenuItem>)
})}
</BootstrapSelect>
The problem is, every time I press on the select the MenuItem elements re-render and this is really time-consuming (10 seconds to make the options showing). Is there a way to make the menu-items render only once?
Sources
This article follows the attribution requirements of Stack Overflow and is licensed under CC BY-SA 3.0.
Source: Stack Overflow
| Solution | Source |
|---|
