const history = useHistory();
const handleClose = useCallback(() => {
history.replace({ hash: '' });
}, []);
return (
<Modal isOpen={history.location.hash === '#email'} onClose={handleClose}>
....
как мы знаем, создавать функции внутри рендера и затем кидать их в пропсы это плохо, потому что при каждом перерендере будет создаваться новая функция и триггерить перерендер компонента в который мы её передаём
но я не знаю точно проверяет ли реакт что это та же самая функция? ну там function.toString() === prevFunc.toString();
поясните плиз за мой код
инфа сотка ?
инфа сотка https://codesandbox.io/s/sharp-cache-ikz31u?file=/src/App.js
Мне кажется, в твоём случае, использование useCallback лишнее, если снаружи ничего не меняется и прокидывать этот хэндлер глубоко не приходится.
компонент рендерится только если в него прилетел новый пропс, или если у него поменялся стейт. ну и при this.forceUpdate() я не хочу чтобы мой компонент перерендеривался когда я в него новую функцию кидаю каждый рендер. поэтому и усе ксаллбацк.. ща поиграю в песочнице . вдруг смысла нет... а то у меня там внутри модалки может быть внушительное дерево. не хочу чтобы оно пересчитывалось каждый чих
Функция это объект. И переменная содержит ссылку на объект в виде функции. Так что тустринг тут вообще не при чем. Usecallback мемоизирует функцию, т.е. возвращает ту же ссылку если зависимости не меняются. Обычно usecallback делается для передачи как зависимость для useeffect, usememo и тп штук. И то что вы её пропихиваете в рендер ничего по идее не поменяет.
всё верно. но обычно это используется для иммутабельности коллбеков. только не понятно для чего в зависимостях к use effect иммутабельные коллбеки.. но вероятно иногда для отсечения лишних рендеров юзят. я же обычно юзю для передачи обработчиков событий на jsx
Обсуждают сегодня