React-Apollo查询重新获取导致子级卸载

Question

我有一个包装在Query组件中的显示组件，用于接收来自GraphQL查询的数据。在执行变异之后，我必须重新获取数据以更新存储。问题是，调用refetch()会导致子组件被卸载，从而中断用户一直在进行的交互和滚动，从而导致突变。

有没有一种方法可以调用refetch()而不会导致子级卸载？如果没有，有没有更好的方法来更新存储而不会导致卸载？下面是包含Query组件及其子组件的代码。

<Query
  query={query}
  variables={{videoId}}
>
  {
    ({loading, error, data, refetch }) => {
      if (loading) 
        return <p>Loading...</p>;
      if (error) {
        console.log(error);
        return <p>Error :(</p>;
      }

      const onChange = () => {
        console.log("refetching");
        return refetch();
      }

      const {timestampCollection} = data;
      return(
          <TimestampCollection onChange={onChange} player={this.state.player} timestampCollection={timestampCollection[0]} />
      )
    }
  }
</Query>

感谢大家的帮助！

Answer 1

试着像下面这样使用fetchPolicy="network-only"。

<Query
  query={query}
  variables={{videoId}}
  fetchPolicy="network-only"
>