[英]Uncaught Error: react-apollo only supports a query, subscription, or a mutation per HOC
I'm trying to wrap my Chat
component with two queries and one mutation using compose
. 我正在尝试使用compose
将我的Chat
组件包含两个查询和一个变异。
However, I'm still getting the following error in the console: 但是,我仍然在控制台中收到以下错误:
Uncaught Error:
react-apollo
only supports a query, subscription, or a mutation per HOC. 未捕获错误:react-apollo
仅支持每个HOC的查询,订阅或突变。[object Object]
had 2 queries, 0 subscriptions and 0 mutations.[object Object]
有2个查询,0个订阅和0个突变。 You can use 'compose
' to join multiple operation types to a component 您可以使用'compose
'将多种操作类型连接到组件
Here are my queries and the export statement: 这是我的查询和导出声明:
// this query seems to cause the issue
const findConversations = gql`
query allConversations($customerId: ID!) {
allConversations(filter: {
customerId: $customerId
})
} {
id
}
`
const createMessage = gql`
mutation createMessage($text: String!, $conversationId: ID!) {
createMessage(text: $text, conversationId: $conversationId) {
id
text
}
}
`
const allMessages = gql`
query allMessages($conversationId: ID!) {
allMessages(filter: {
conversation: {
id: $conversationId
}
})
{
text
createdAt
}
}
`
export default compose(
graphql(findConversations, {name: 'findConversationsQuery'}),
graphql(allMessages, {name: 'allMessagesQuery'}),
graphql(createMessage, {name : 'createMessageMutation'})
)(Chat)
Apparently, the issue is with the findConversations
query. 显然,问题在于findConversations
查询。 If I comment it out, I don't get the error and the component loads properly: 如果我将其注释掉,我就不会收到错误并且组件正确加载:
// this works
export default compose(
// graphql(findConversations, {name: 'findConversationsQuery'}),
graphql(allMessages, {name: 'allMessagesQuery'}),
graphql(createMessage, {name : 'createMessageMutation'})
)(Chat)
Can anyone tell me what I'm missing? 谁能告诉我我错过了什么?
By the way, I also have a subscription set up on the allMessagesQuery
, in case that's relevant: 顺便说一句,我也在allMessagesQuery
上设置了订阅,如果相关的话:
componentDidMount() {
this.newMessageSubscription = this.props.allMessagesQuery.subscribeToMore({
document: gql`
subscription {
createMessage(filter: {
conversation: {
id: "${this.props.conversationId}"
}
}) {
text
createdAt
}
}
`,
updateQuery: (previousState, {subscriptionData}) => {
...
},
onError: (err) => console.error(err),
})
}
Your findConversationsQuery
is actually two queries. 您的findConversationsQuery
实际上是两个查询。 This one: 这个:
query allConversations($customerId: ID!) {
allConversations(filter: {
customerId: $customerId
})
}
And this one: 还有这个:
{
id
}
The entire query needs to be enclosed between a single pair of opening and closing brackets. 整个查询需要包含在一对开始和结束括号之间。
I think what you meant to write is: 我想你的意思是:
query allConversations($customerId: ID!) {
allConversations(filter: { customerId: $customerId }){
id
}
}
声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.