Middle
Como organizar o polling da lista de utilizadores a cada 15 segundos usando TanStack Query (React Query)? Qual função usar e com quais parâmetros?
sobes.tech IA
Resposta da IA
Для организации polling с помощью TanStack Query (React Query) используется опция refetchInterval в хукe useQuery. Она задает интервал в миллисекундах, с которым будет автоматически повторяться запрос.
Пример для опроса списка пользователей раз в 15 секунд:
import { useQuery } from '@tanstack/react-query';
function fetchUsers() {
return fetch('/api/users').then(res => res.json());
}
function UsersList() {
const { data, error, isLoading } = useQuery(['users'], fetchUsers, {
refetchInterval: 15000, // 15 секунд
refetchIntervalInBackground: true, // опционально, чтобы опрашивать даже если вкладка не активна
});
if (isLoading) return <div>Загрузка...</div>;
if (error) return <div>Ошибка: {error.message}</div>;
return (
<ul>
{data.map(user => (
<li key={user.id}>{user.name}</li>
))}
</ul>
);
}
Таким образом, useQuery с refetchInterval позволяет автоматически обновлять данные по таймеру.