2017-02-25 7 views
2

composeを使用してChatコンポーネントを2つのクエリと1つの突然変異でラップしようとしています。未知のエラー:react-apolloは、HOCあたりのクエリ、サブスクリプション、または突然変異のみをサポートします

しかし、私はまだ、コンソールに次のエラーを取得しています:ここで

Uncaught Error:react-apollo only supports a query, subscription, or a mutation per HOC. [object Object] had 2 queries, 0 subscriptions and 0 mutations. You can use ' compose ' to join multiple operation types to a component

が私のクエリと輸出の文です:

// 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) 

どうやら、問題がfindConversationsクエリであります。私はそれをコメントアウトした場合、私はエラーと適切コンポーネントの負荷を得ることはありません:

// this works 
export default compose(
    // graphql(findConversations, {name: 'findConversationsQuery'}), 
    graphql(allMessages, {name: 'allMessagesQuery'}), 
    graphql(createMessage, {name : 'createMessageMutation'}) 
)(Chat) 

誰もが私が欠けているものを私に伝えることができますか?ところで

は、私はまた、関連性の場合には、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), 
    }) 

} 

答えて

3

あなたfindConversationsQueryは実際には2つのクエリです。これ:

query allConversations($customerId: ID!) { 
    allConversations(filter: { 
     customerId: $customerId 
    }) 
} 

そしてこれ:

{ 
    id 
} 

クエリ全体を開閉ブラケットの単一の対の間に封入される必要があります。私はあなたが書くためにどのような意味だと思い

は次のとおりです。

query allConversations($customerId: ID!) { 
    allConversations(filter: { customerId: $customerId }){ 
     id 
    } 
} 
関連する問題