作者:谋 | 来源:互联网 | 2022-12-09 15:38
我
在一个组件中使用Apollo Client ,在生命周期方法中更改状态时重新呈现该组件.我希望我的
组件重新运行查询,因为我知道数据已更改.在重新运行查询之前,Query组件似乎正在使用需要失效的缓存.
我正在使用一个不稳定的解决方法来缓存refetch
来自父组件中的渲染道具的回调,但感觉不对.如果有人有兴趣,我会在答案中发布我的方法.
我的代码看起来像这样.为简洁起见,我从查询中删除loading
并error
处理了一些其他细节.
class ParentComponent extends React.Component {
componentDidUpdate(prevProps) {
if (this.props.refetchId !== prevProps.refetchId) {
const otherData = this.processData() // do something
this.setState({otherData}) // this forces component to reload
}
}
render() {
const { otherData } = this.state
return (
{({ data }) => {
return
}}
)
}
}
如何强制
获取要传递的新数据
?
即使ParentComponent
在道具或状态发生变化时重新渲染,Query
也不会重新运行.ChildComponent
得到一个更新的stateData
道具,但有一个陈旧的gqlData
道具.据我所知,Apollo的查询缓存需要失效,但我不确定.
请注意,传递refetch
给ChildComponent不是答案,因为它只显示来自GraphQL的信息,并且不知道何时重新获取.我不想引入定时器或以其他方式复杂化ChildComponent
来解决这个问题 - 它不需要知道这种复杂性或数据提取问题.