如何通知 GraphQL 突变的其他组件

Question

假设我正在开发一个简单的待办事项应用程序，就反应组件而言，它的结构是这样的（不是实际的反应代码）

<AddTodo />
<TodoList>
  <TodoItem ..>
  <TodoItem ..>
</TodoList>

TodoList 组件被包裹在 graphql(gql '..some query') HOC 中，也被包裹在 graphql(qql'..some mutation') 中以处理待办事项的查询和切换它们的 done 状态；当调用突变时，TodoList 组件知道用新数据重新呈现自己。

AddTodo 被另一个 HOC 包裹，添加了另一个突变以添加新的 todo 项。但是触发它不会重新渲染TodoList。

这个小应用没有像redux那样的状态管理，我的理解是React-Apollo是为了替代redux。为什么在TodoList 中会自动发生刷新以及如何从AddTodo 传播刷新？

Answer 1

有很多方法可以通知TodoList添加了新的待办事项

1. 通过update 选项进行突变后更新您的缓存存储。示例：

   ...
   this.props.addTodo({
    variables: {
     content: text,
    },
    update: (store, { data: { addTodo } }) => {
     const data = store.readQuery({query: your_query_name})
     // do update store here ...
     store.writeQuery({query: your_query_name, data})
    }
   })
   ...
   

2. 使用Subscription和subscribeToMore选项按照here的说明操作