我想每 3 秒更新一次而不使用 react apollo refetch

Question

我正在使用 React apollo。
我想每 3 秒更新一次进度条组件的 user.percent，而不使用 apllo 的 refetch。

import {useInterval} from 'beautiful-react-hooks';

const ProgressBar = () => {
  const {userId} = useParams<{userId: string}>();
  const {data: {user = null} = {}, refetch: refetchUser} =
    useUserQuery({
      variables: {uuid: userId},
      skip: !userId,
    });
  if (!user) return null;

  useInterval(() => {
    refetchUser();
  }, 3000);

  return (
     <p>{user.percent}</p>
  )
}

Answer 1

您可以使用 Apollo's polling feature 每 X 毫秒执行一次查询。

  const {data: {user = null} = {}, startPolling, stopPolling} = useUserQuery({
      variables: {uuid: userId},
      skip: !userId,
      pollInterval: 3000, // <-- refetch every 3 sec

    });

您可以分别使用 startPolling 和 stopPolling 功能开始和 pause/stop 轮询。

我想每 3 秒更新一次而不使用 react apollo refetch

I want to update every 3 seconds without using react apollo refetch

typescript

apollo

reactjs