LH
handleResize = () => { setWidth(window.innerWidth } - обробник на window.resize подію. useEffect спрацьовує раз, setWidth спрацьовує на зміну вікна. Виклик setWidth перезапускає ж хук.значить в тебе анмаунтиться компонент абощо
Size: a a a
2020 August 10
LH
> If you want to run an effect and clean it up only once (on mount and unmount), you can pass an empty array ([]) as a second argument. This tells React that your effect doesn’t depend on any values from props or state, so it never needs to re-run. This isn’t handled as a special case — it follows directly from how the dependencies array always works.
https://reactjs.org/docs/hooks-effect.html
https://reactjs.org/docs/hooks-effect.html
A
Питання не про
useEffect :)LH
> Виклик
setWidth перезапускає ж хук.LH
який хук?
A
Кастомний хук. В моєму прикладі це
useWindowWidth.LH
зрозумів
EM
LH
можливо спробуй обернути його в мемо
A
Спробуйте відкрити консоль і зменшити/збільшити вікно.
EM
ну вот и попробуй)
EM
какая задача стоит?
EM
при изменении по высоте он не будет дергаться
EM
при горизонтальном резайзе, очевидно будет
A
какая задача стоит?
Це не мій реальний кейс. Я навішав обробник на
Якщо провести аналогію з пропсами, то
window.resize, як приклад частого виклику хука і навмисно повертав 1 як постійне значення.useWindowWidth спрацьовує на зміну ширини/висоти екрану, але повертає одне і те ж значення. Через постійне спрацювання useWindowWidth, App ререндериться.Якщо провести аналогію з пропсами, то
<App width={useWindowWidth()}, не повинен ререндеритись, якщо width буде те ж саме. От мені саме цю логіку потрібно отримати :)EM
Ты путаешь
VS
Те, що вертає хук — це не аналогія пропса, скоріше стейта. Ти ж передаєш не зверху пропсами в компонент. Відповідно, навіть якщо значення не змінюється, стейт (хук) змінюється. Тому і ререндер
EM
Ты возвращаешь 1, но стейт меняешь