Question

这是我的包装组件：

export default compose(
    graphql(VOTE_MUTATION, { 
        name: 'voteMutation',
        props: ({ ownProps, mutate }) => ({
          submit({ commentId, commentContent }) {
            return mutate({
              variables: { input },
              optimisticResponse: {
                __typename: 'Mutation',
                updateComment: {
                  id: input.activeNews.id,
                  __typename: 'News',
                  ...input.activeNews
                },
              }
            });
          },
        }),
      }),
    graphql(ALL_NEWS_QUERY, { name: 'allNewsQuery' })
)(withApollo(withRouter(NewsFeed)))

然而，当我尝试调用突变时，我有一个错误，指出this.props.voteMutation不是一个函数？所以我不知道如何专门打电话给这个名字。

我做了一个像这样的简单注册和登录变种，工作正常：

export default compose(
    graphql(CREATE_USER_MUTATION, { name: 'createUserMutation' }),
    graphql(AUTHENTICATE_USER_MUTATION, { name: 'signinUserMutation' })
)(Login)

我用this.props.createUserMutation（）调用它，但是，调用this.props.voteMutation不是一个函数。帮助

Answer 1

您应该使用voteMutation而不是mutate。在映射之前自定义道具名称。此外，正确的解构方法是{ voteMutation, ...ownProps }，即便如此，您还没有在任何地方使用ownProps

因此，请将mutate替换为代码段中的voteMutation：

export default compose(
    graphql(VOTE_MUTATION, { 
        name: 'voteMutation',
        props: ({ voteMutation }) => ({
          submit({ commentId, commentContent }) {
            return voteMutation({
              variables: { input },
              optimisticResponse: {
                __typename: 'Mutation',
                updateComment: {
                  id: input.activeNews.id,
                  __typename: 'News',
                  ...input.activeNews
                },
              }
            });
          },
        }),
      }),
    graphql(ALL_NEWS_QUERY, { name: 'allNewsQuery' })
)(withApollo(withRouter(NewsFeed)))

如何用乐观的响应配置命名apollo中的变异？

1 个答案: