graphql - 删除突变的乐观更新

Question

我正在编写一个删除突变。突变应该删除 Key 节点并更新 viewer 的 keys 集合(我正在使用中继式集合:viewer { 键(第一个:3){ 边缘 { 节点 { ... }}}}。

遵循建议here ，为了简单起见，我使用 FIELDS_CHANGE 配置，它确实有效:

export class DeleteKeyMutation extends Relay.Mutation {
  static fragments = {
    viewer: () => Relay.QL`
      fragment on Viewer { id }
    `,
  };
  getMutation() { return Relay.QL`mutation {deleteKey}`; }
  getVariables() {
    return {
      id: this.props.id,
    };
  }
  getFatQuery() {
    return Relay.QL`
      fragment on DeleteKeyPayload {
        viewer { keys }
      }
    `;
  }
  getConfigs() {
    return [
      {
        type: 'FIELDS_CHANGE',
        fieldIDs: {
          viewer: this.props.viewer.id,
        },
      },
    ];
  }
}

现在，我应该如何为此编写乐观突变？我尝试过不同的方法，但没有成功。

Answer 1

Relay中的乐观更新只是模拟操作成功时服务器将返回的内容。在您的情况下，您要删除一个键，这意味着结果将是一个没有该键的对象。

getOptimisticUpdate() {
  return {
    viewer: {
      id: this.props.viewer.id,
      keys: {
        edges: this.props.viewer.keys.edges.filter((keyEdge) => key.node.id !== this.props.id)
      }
    }
  };
}

您还需要包含片段的 key ，以便它们在突变中可用。

static fragments = {
  viewer: () => Relay.QL`
    fragment on Viewer { id, keys { edges(first: 3) { node { id } }}
  `,
};

这种方法的问题在于，它依赖于您的突变来了解当前的键分页是什么。如果您一次对整个连接进行操作，那没问题，但如果您使用中继分页，则应考虑使用其他突变操作。

有 NODE_DELETE，它可以从 Relay 存储中删除所有出现的 key ，或者您可以使用 RANGE_DELETE 仅从当前连接中删除它。