为什么 Apollo useQuery 钩子会在出错时导致无限重新渲染？

Question

我使用 Apollo 的 useQuery 钩子和 graphql.macro 库从 .graphql 文件加载查询。这是在 create-react-app 项目中，所以没有自定义 webpack 配置。

该组件始终以加载状态开始，如果网络请求成功则工作。但是，如果网络请求不成功，组件会重新渲染并无限重试请求。解决方案是将调用移动到 loader 自定义挂钩之外的 useData，但为什么呢？ useQuery 钩子是否基于 DocumentNode 在内部记忆请求？如果是这样，为什么这只发生在错误状态而不是请求成功时？

useData.ts

export const useData = (dataID: string = '') => {
  const dataQuery = loader('../graphql/queryData.graphql');
  const { data, error, loading } = useQuery<IData>(dataQuery, {
    variables: { id: dataID },
  });

  return { data, error, loading };
};

component.tsx

export const ViewData: React.FunctionComponent<Props> = ({ dataID }) => {
  const { data, error, loading } = useData(dataID);

  if (loading) {
    return <div>Loading Data...</div>;
  }

  if (error) {
    return (
      <div>
        {`Failed to find data ${dataID}, please check the ID and try again.`}
      <div/>
    );
  }

  const { name, type } = data;

  return (
    <div>
      { `Displaying ${name} of ${type}` }
    </div>
  );
};

感谢您的帮助！