React-Apollo Mutation returns 空响应

Question

我正在使用 AWS Appsync，我想从成功执行的变更中获得响应。当我在 Appsync Graphql 控制台中尝试我的设置时，我得到一个填充的 "data": { "mutateMeeting" } 响应：

当我在我的 React 应用程序中尝试相同的操作时，我可以在 dynamodb 数据库中看到发生了突变，但是 react-apollo 没有 return 突变回复。正如您在 apollo 开发工具中看到的那样，"data": { "mutateMeeting" } 是 null :

我错过了什么？

对应的graphql schema为：

input MeetingInput {
  id: String,
  start: String!,
  end: String!,
  agreements: [AgreementInput]!
}

type Meeting {
  id: String!
  start: String!
  end: String!
  agreements: [Agreement]
}

type Mutation { 
  mutateMeeting (
    companyId: String!,
    meeting: MeetingInput!
  ): Meeting!
}

graphql-tag 突变 读取：

import gql from 'graphql-tag'

export default gql`
  mutation mutateMeeting($companyId: String!, $meeting: MeetingInput!) {
    mutateMeeting(companyId: $companyId, meeting: $meeting) {
      id,
      start,
      end
    }
  }
`

和 react-apollo 组合由：

import React, { Component } from 'react'
// antd
import { Spin } from 'antd'
// graphql
import { compose, graphql } from 'react-apollo'
import mutateMeeting from '../queries/mutateMeeting'

class MeetingStatus extends Component {
  componentDidMount() {
    const { mutateMeeting, meeting } = this.props
    console.log(meeting)
    const variables = {
      companyId: meeting.company.id,
      meeting: {
        start: meeting.start.toISOString(),
        end: meeting.end.toISOString(),
        agreements: meeting.agreements,
      }
    }
    console.log(variables)

    mutateMeeting({
      variables
    }).then(({data}) => console.log('got data', data))
    .catch(err => console.log(err))
  }

  render() {
    console.log(this.props)
    return <div>convocado</div>
  }
}

const MeetingStatusWithInfo = compose(
  graphql(mutateMeeting, { name: 'mutateMeeting' })
)(MeetingStatus)

export default (MeetingStatusWithInfo)

Appsync 请求

#set($uuid = $util.autoId())
#set($batchData = [])
#set( $meeting = ${context.arguments.meeting} )

## Company
#set( $meetingMap = {
  "PK" : $context.arguments.companyId,
  "SK" : "Meeting-$uuid",
  "start" : $meeting.start,
  "end" : $meeting.end
} )
$util.qr($batchData.add($util.dynamodb.toMapValues($meetingMap)))

## Meeting
$util.qr($meetingMap.put("PK", $meetingMap.SK))
$util.qr($batchData.add($util.dynamodb.toMapValues($meetingMap)))

## Agreements
#foreach($agreement in $meeting.agreements)
  #set( $agreementId = $util.autoId())
  #set( $agreementMap = {
    "PK" : $meetingMap.SK,
    "SK" : "Agreement-$agreementId",
    "name" : $agreement.name
  } )

  $util.qr($batchData.add($util.dynamodb.toMapValues($agreementMap)))
#end

{
  "version" : "2018-05-29",
  "operation" : "BatchPutItem",
  "tables": {
    "Vysae": $utils.toJson($batchData)
  }
}

Appsync 响应:

#set( $meeting = $context.result.data.Vysae[1] )
{
  "id": "$meeting.PK",
  "start": "$meeting.start",
  "end": "$meeting.end"
}

Answer 1

看起来这个错误 here. There's additional details in this original issue 也有一个未解决的问题。

The user information in the SessionQuery will initially be cached and watched by the UserProfile component. When the UpdateAvatarMutation executes and returns, the query in the UserProfile component will receive empty data. Several others have also observed this behavior and all traced it to an imperfect overlap between the queried/cached fields and the fields returned on the mutation (in this example, email is missing from the User node on the mutation's returned results.

换句话说，如果您有一个 returns 相同类型对象的查询，并且查询和变更之间的字段不匹配，您最终可能会得到空数据。这不是预期的行为，但如果这是本例中的根本问题，您可以尝试确保请求的字段对于您的查询和变更都是相同的。

Answer 2

在我的例子中，我必须在突变中编写一个 update 函数才能返回数据。

尝试将您的突变更改为此并在控制台中查看这是否有任何改变：

mutateMeeting({
  variables,
  update: (proxy, {data: {mutateMeeting}}) => {
     console.log("Update: ", mutateMeeting);
  }
}).then(({data}) => console.log('got data', data))
  .catch(err => console.log(err))
}

update 函数可能会被调用几次，但您最终应该会看到数据按预期返回。

这对我有用。如果你愿意，你可以看看我的问题，看看是否有帮助：React Apollo - Strange Effect When Making Mutation?

React-Apollo Mutation returns 空响应

React-Apollo Mutation returns empty response

reactjs

graphql

apollo

react-apollo

aws-appsync