Question

我在React（网络）中玩过Apollo的新apollo-boost，我想知道两件事：a）为什么Apollo不会自动重新获取数据变量变化和b）如何在Query组件之外调用重新获取？

在我的特定用例中，我需要从父组件的状态传递某些过滤器。请考虑以下代码：

class GalleryPage extends Component {
  constructor () {
    super();
    this.state = {
      filters:           {
        brands:    [1, 3],
        filetypes: [4, 5, 6],
      },
    };
  }

  render() {
    return (
      <div>
        <Query query={FilesQuery} variables={this.state.filters}>
          {result => (result.networkStatus === 7 ? result.data.files.map(file => <div>{file.name}</div>) : '')}
        </Query>
      </div>
    );
  }
}

当this.state.filters发生变化时，我希望Apollo能够重新获取数据。但由于这不起作用，我试图致电refetch。我可以通过从数据中对其进行解构来调用refetch，并将其称为：<button type="button" onClick={() => refetch()}>Refetch</button>。显然，这不会在组件之外工作。而且我不知道如何在组件之外调用它。我觉得事件系统在这里可能会有所帮助，但我不确定这是否是正确的方法。

提前致谢！

Answer 1

示例代码中的问题似乎是嵌套对象似乎没有触发重新获取。所以，我所做的仍然是触发重新获取，改变了状态的组织：

// Instead of
this.state = {
  filters: {
    brands: [1, 3],
    filetypes: [4, 5, 6],
  }
}

// I'm now doing
this.state =  {
  filteredBrands: [1, 3],
  filteredFiletypes: [4, 5, 6]
}

Apollo在组件外部提升触发器重新获取

1 个答案: