Проверяет знание работы с событиями в функциональных компонентах React.
В функциональных компонентах можно подписаться на события, используя useEffect для side-эффектов или напрямую добавляя обработчики на элементы (например, onClick). Для отписки от событий (например, resize, scroll) нужно возвращать функцию очистки из useEffect.
import { useEffect } from 'react';
function MyComponent() {
const handleClick = () => {
console.log('Клик!');
};
useEffect(() => {
window.addEventListener('resize', handleResize);
return () => window.removeEventListener('resize', handleResize); // Отписка
}, []);
return <button onClick={handleClick}>Нажми меня</button>;
}useEffect(() => {
const subscription = someEventEmitter.on('update', handleUpdate);
return () => subscription.unsubscribe(); // Отписка
}, []);onClick, onChange):function Form() {
const handleSubmit = (e) => {
e.preventDefault();
console.log('Форма отправлена!');
};
return <form onSubmit={handleSubmit}>...</form>;
}Итог:
Для DOM-событий (resize, scroll) используй useEffect + отписку.
Для кастомных событий (WebSocket, EventEmitter) также нужен useEffect.
Для React-событий (onClick, onSubmit) обработчики вешаются напрямую.