Back to questions
IT One
Middle+
1
Напиши абстрактную реализацию компонента Child с мемоизацией через React.memo. Какой второй аргумент принимает React.memo?
Companies where asked
Answer from AI
sobes.tech AI
React.memo — это HOC (Higher Order Component), который мемоизирует функциональный компонент, предотвращая его повторный рендер, если пропсы не изменились.
Второй аргумент React.memo — это функция сравнения (areEqual), которая принимает (prevProps, nextProps) и должна вернуть true, если пропсы считаются равными (то есть ререндер не нужен), и false — если нужно обновить компонент.
Пример абстрактного компонента Child с React.memo:
import React from 'react';
const Child = React.memo(function Child({ data }) {
console.log('Child render');
return <div>{data.text}</div>;
}, (prevProps, nextProps) => {
// Сравниваем только поле text
return prevProps.data.text === nextProps.data.text;
});
export default Child;
В этом примере компонент Child будет перерендериваться только если поле data.text изменится. Если пропсы равны по логике функции сравнения, React пропустит ререндер.