为什么我的 Apollo 客户端乐观回复失败？

Question

我正在录制这个以记录我花了几个小时才解决的问题的答案。场景：

我在 React Apollo-Client 的单个组件上使用了两个突变查询。这是一个组件被包裹到一个更大的组件中以形成一个页面。像这样的东西（这不是实际的代码，但它应该给出了想法）：

import { compose } from 'react-apollo';

// submitNewUser contains
//  postedBy
//  createdAt
//  content

// submitRepository contains
//  otherProp

const thisProps1 = {
  name: 'mutation1',
  props: ({ ownProps, mutation1 }) => ({
    submit: ({ repoFullName, commentContent }) => mutation1({
      variables: { repoFullName, commentContent },
      optimisticResponse: {
        __typename: 'Mutation',
        submitNewUser: {
          __typename: 'Comment',
          postedBy: ownProps.currentUser,
          content: commentContent,
        },
      },
    }),
  }),
};
const thisProps2 = {
  name: 'mutation2',
  props: ({ ownProps, mutation2 }) => ({
    submit: ({ repoFullName, commentContent }) => mutation2({
      variables: { repoFullName, commentContent },
      optimisticResponse: {
        __typename: 'Mutation',
        submitRepository: {
          __typename: 'Comment',
          otherProp: 'foobar',
        },
      },
    }),
  }),
};
const ComponentWithMutations = compose(
  graphql(submitNewUser, thisProps1),
  graphql(submitRepository, thisProps2)
)(Component);

每当乐观响应触发时，只有第二个结果被反馈到外部组件中的查询响应中。换句话说，第一个查询给出了一个 'undefined' 响应（但没有错误），而第二个 returns 一个预期的对象。

为什么？？

Answer 1

属性"createdAt"不在乐观回复中

__typename: 'Comment',
postedBy: ownProps.currentUser,
content: commentContent,

应该是：

__typename: 'Comment',
postedBy: ownProps.currentUser,
createdAt: Date(),
content: commentContent,

乐观答复中缺少的字段将默默地失败 return 任何调用该数据的查询。

为什么我的 Apollo 客户端乐观回复失败？

Why is my Apollo Client optimistic reply failing?

apollo

react-apollo

apollo-client