Я уверен, что это очень простой вопрос для решения, однако мои попытки не дали результатов, и ни один LLM не дает мне ответа, который работает. У меня есть приведенный ниже MemoifiedList, который работает нормально. Проблема в том, что в нем есть 50 пунктов, и каждый раз, когда изменяется один элемент, каждый элемент списка получает редернизацию, что вызывает отставание. < /P>
const [selectorInstruments, setSelectorInstruments] = useState({});
const InstrumentList = useMemo(() => {
return Object.values(selectorInstruments).map((selectorInstrument: InstrumentSelectorInstrument) => (
))
}, [selectorInstruments]);
< /code>
Ниже приведен элемент списка с использованием React.memo. Я попытался установить обратный вызов, чтобы проверить изменения поддержки, но обратный вызов даже не работает. У меня есть консоль.logged () внутри, чтобы убедиться, что каждый элемент рендеринг каждый раз. < /P>
const SelectorInstrumentItem = React.memo(({selectorInstrument}: { selectorInstrument: InstrumentSelectorInstrument}) => {
return {
e.stopPropagation();
handleDropdownItemEvent(e, selectorInstrument.id);
}}
>
});
< /code>
Ниже я обновляю SelectedItems. Он обновляет два из них, но, как я уже сказал, все 50 получают редернизацию < /p>
setSelectorInstruments(prevState => {
const newState: Record = {...prevState}
const newInstrument = newState[instrumentId];
if (newInstrument) {
newState[instrumentId] = {
...newInstrument,
view: instrumentInformation.view
}
}
const prevInstrument = newState[oldPrimaryInstrument.instrument.id];
if (prevInstrument) {
newState[oldPrimaryInstrument.instrument.id] = {
...prevInstrument,
view: oldPrimaryInstrument.view
}
}
return newState;
});
Подробнее здесь: https://stackoverflow.com/questions/795 ... item-basis