Как использовать async/await внутри useEffect
Python
Middle
Без компании
Как использовать async/await внутри useEffect
Ответы
В React нельзя напрямую использовать `async/await` внутри `useEffect`, потому что `useEffect` ожидает либо функцию очистки, либо `undefined`, а `async` функция всегда возвращает промис.
**Решение:**
Создайте асинхронную функцию внутри `useEffect` и вызовите её:
```
useEffect(() => {
const fetchData = async () => {
const response = await fetch('https://api.example.com/data');
const data = await response.json();
console.log(data);
};
fetchData();
}, []);
```
**Очистка (если нужно):**
Если запрос может быть отменён, используйте `AbortController`:
```
useEffect(() => {
const controller = new AbortController();
const fetchData = async () => {
try {
const response = await fetch('https://api.example.com/data', {
signal: controller.signal,
});
const data = await response.json();
console.log(data);
} catch (error) {
if (error.name !== 'AbortError') {
console.error(error);
}
}
};
fetchData();
return () => controller.abort();
}, []);
```