我正在尝试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>
);
});
在发送以{ data: `Hello ${new Date()}` }
作为有效负载的响应之前,服务器会延迟500ms。当我单击按钮时,我希望看到Loading...
,但是该组件仍然显示Hello [date]
并在半秒钟后重新渲染。
根据this,networkStatus
应该为4(refetch
),因此loading
应该为true。我的期望错了吗?还是React Apollo文档中未提及的有关缓存的事情?
我正在使用的项目模板使用SSR,因此初始查询发生在服务器上;只有重新浏览会在浏览器中发生-即使那会有所作为。
答案 0 :(得分:1)
您好,您只需要在查询选项中指定notifyOnNetworkStatusChange: true
(默认为false
)。