使用 react-apollo 重新获取查询：为什么“加载”不正确？答案

【问题标题】：refetching a query with react-apollo: why is `loading` not true?使用 react-apollo 重新获取查询：为什么“加载”不正确？
【发布时间】：2019-08-15 21:59:14
【问题描述】：

我正在尝试 Apollo 并使用以下相关代码：

const withQuery = graphql(gql`
query ApolloQuery {
  apolloQuery {
    data
  }
}
`);

export default withQuery(props => {
  const {
    data: { refetch, loading, apolloQuery },
  } = props;

  return (
        <p>
          <Button
            variant="contained"
            color="primary"
            onClick={async () => { await refetch(); }}
          >
            Refresh
          </Button>
          {loading ? 'Loading...' : apolloQuery.data}
        </p>
  );
});

服务器延迟 500 毫秒，然后发送带有 { data: `Hello ${new Date()}` } 作为负载的响应。当我单击按钮时，我希望看到Loading...，但组件仍然显示Hello [date] 并在半秒后重新渲染。

根据this，networkStatus 应该是 4 (refetch)，因此loading 应该为真。我的期望错了吗？还是 React Apollo 文档中没有提到有关缓存的事情？

我正在使用的项目模板使用 SSR，因此初始查询发生在服务器上；仅在浏览器中进行重新获取 - 只要这可能会有所作为。

【问题讨论】：

标签： reactjs graphql apollo react-apollo apollo-client

【解决方案1】：

我认为您需要在查询选项中指定notifyOnNetworkStatusChange: true（默认为false）。

【讨论】：

在哪里设置这个选项？
@BryanLumbantobing 你在这里设置了这个选项： const { data, loading, refetch } = useQuery( UsersQuery({ activeUser }), { notifyOnNetworkStatusChange: true } );