删除突变的乐观更新

Question

我正在编写一个删除突变。突变应该删除一个Key节点并更新viewer的keys集合（我使用的是Relay样式的集合：viewer { keys(first: 3) { edges { node { ... }}}}.

按照这里的建议，为了简单起见，我使用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)
      }
    }
  };
}

你还需要包括你的片段的密钥，以便它们在突变中可用。

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

这种方法的问题在于，它依赖于你的突变来知道你当前的密钥分页是什么。如果你同时对整个连接进行操作，这是可以的，但如果你使用中继分页，你应该考虑使用其他变异操作。

有NODE_DELETE，它可以从中继存储中删除所有出现的密钥，也可以使用RANGE_DELETE仅从当前连接中删除它。