React-Apollo Mutation 返回空响应

Posted 2023-03-08

【中文标题】React-Apollo Mutation 返回空响应

【英文标题】：React-Apollo Mutation returns empty response

【发布时间】：2019-01-26 21:18:28

【问题描述】：

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

当我在我的 react 应用程序中尝试相同的操作时，我可以在 dynamodb 数据库中看到发生了突变，但 react-apollo 没有返回突变响应。正如您在 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)

应用同步请求

#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"

【问题讨论】：

您能提供您的解析器吗？因为它们可能无法正确返回具有正确嵌套中预期属性名称的信息，所以您可能需要在返回数据后在客户端上运行更新或 updateQueries。

我会看看更新功能并添加解析器；)

您最快的开始将在这里：apollographql.com/docs/react/essentials/mutations.html#update

@BenjaminCharais 您提到的更新功能用于刷新缓存。我想要由我的请求解析器创建的 ID 作为突变的响应。

啊，我误解了，但是您的解析器在哪里，因为如果您从它们传回适当的信息，那么来自突变的响应将适当地映射到请求。我可以在信息流中添加一个答案.... 虚拟数据。

【参考方案1】：

这个错误here 似乎有一个未解决的问题。 this original issue 中还有其他详细信息。

SessionQuery 中的用户信息最初会被 UserProfile 组件缓存和监视。当 UpdateAvatarMutation 执行并返回时，UserProfile 组件中的查询将收到空数据。其他几个人也观察到了这种行为，并且都将其追溯到查询/缓存字段与突变返回的字段之间的不完美重叠（在此示例中，突变返回结果的用户节点中缺少电子邮件。

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

【参考方案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?