Reputation: 1930
I have MyExampleComponent
like this
<Query query={GET_UPGRADE_OFFER}>
{({loading, error, data}) => {
if (!loading && !error) {
return (<Mutation mutation={GET_UPGRADE_QUOTE}>
{(mutateIntegration, response) => (
<MyComponent mutateIntegration={mutateIntegration} {...response} data={data} />
)}
</Mutation>);
}
return null;
}};
</Query>
I have a component like this. Query wraps a Mutation. I want to pass the data from Query to Mutation
It throws an error in console TypeError: (0 , this.props.children) is not a function
This component is being called from another component
<Query>
<ApolloConsumer>
<MyExampleComponent />
</ApolloConsumer>
</Query>
Upvotes: 1
Views: 1867
Reputation: 1930
It was a mistake from my end.
The error was at }};
. ;
inside a component is considered as invalid children. Valid ones are components, expressions, null, false, true & undefined.
https://reactjs.org/docs/jsx-in-depth.html
Upvotes: 4