本文是小编为大家收集整理的关于React-Apollo突变返回空响应的处理/解决方法,可以参考本文帮助大家快速定位并解决问题,中文翻译不准确的可切换到English标签页查看源文。
问题描述
我正在使用AWS Appsync,我想从成功执行的突变中获得响应.当我在appsync graphQl控制台中尝试设置时,我会得到一个填充"data": { "mutateMeeting" }响应:
当我在DynamoDB数据库中可以看到的React应用程序中尝试相同的过程时,突变发生了,但是 React-Apollo 不会返回突变响应.如您在Apollo Dev工具中所看到的,"data": { "mutateMeeting" }是 null :
我缺少什么?
相应的 graphQl架构读取:
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 inklusion由:
给出: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" }
推荐答案
也是如此.SessionQuery中的用户信息最初将由用户填充组件进行缓存和观看.当UpdateAvatarm名单执行和返回时,用户填充组件中的查询将接收空数据.其他几个人也观察到了这种行为,所有这些都将其追溯到了查询/缓存字段与返回突变的字段之间的不完美重叠(在此示例中,突变返回结果的用户节点缺少电子邮件.
.
换句话说,如果您的查询返回相同类型的对象,并且查询和突变之间的字段不匹配,则最终可能会得到空数据.这不是预期的行为,但是如果这是在这种情况下的潜在问题,您可以尝试确保查询和突变所请求的字段相同.
其他推荐答案
在我的情况下,我必须在突变中编写update函数才能返回数据.
尝试将突变更改为此,并在控制台上查看是否改变了任何东西:
mutateMeeting({ variables, update: (proxy, {data: {mutateMeeting}}) => { console.log("Update: ", mutateMeeting); } }).then(({data}) => console.log('got data', data)) .catch(err => console.log(err)) }
update函数可能会被调用几次,但是您最终应该看到数据返回.
这对我有用.如果需要,可以查看我的问题,看看是否有帮助:本文地址:https://www.itbaoku.cn/post/1938075.html
问题描述
I am using AWS Appsync where I want to get a response from a successfully executed mutation. When I try my setup in the Appsync Graphql console I get a filled "data": { "mutateMeeting" } response:
When I try the same in my react application I can see in the dynamodb database, that the mutations happen, but react-apollo does not return the mutation response. As you can see in the apollo dev tool, the "data": { "mutateMeeting" } is null :
What am I missing?
The corresponding graphql schema reads:
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! }
the graphql-tag mutation reads:
import gql from 'graphql-tag' export default gql` mutation mutateMeeting($companyId: String!, $meeting: MeetingInput!) { mutateMeeting(companyId: $companyId, meeting: $meeting) { id, start, end } } `
and the react-apollo inklusion is given by:
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 request
#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 response:
#set( $meeting = $context.result.data.Vysae[1] ) { "id": "$meeting.PK", "start": "$meeting.start", "end": "$meeting.end" }
推荐答案
Looks like there's an open issue for this bug here. There's additional details in this original issue as well.
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.
In other words, if you have a query that returns the same type of object, and there's a mismatch in the fields between the query and the mutation, it's possible you will end up with null data. It's not expected behavior, but if this is the underlying issue in this case, you could try to ensure the requested fields are the same for both your query and mutation.
其他推荐答案
In my case, I had to write an update function in the mutation in order to get the data returned.
Try changing your mutation to this and look in the console to see if this changes anything:
mutateMeeting({ variables, update: (proxy, {data: {mutateMeeting}}) => { console.log("Update: ", mutateMeeting); } }).then(({data}) => console.log('got data', data)) .catch(err => console.log(err)) }
The update function might be called a couple of times, but you should eventually see your data being returned as you expect it.
This is what worked for me. If you want, you can look at my question and see if that helps: React Apollo - Strange Effect When Making Mutation?