React Apollo - Make Multiple Queries
If you don't want to reuse any of those queries independently, why not make a single request by combining both queries in one i.e:
const combinedQueries = gql`
{
apps {
id
name
}
subjects {
id
name
}
}
`
and then you can use it in your component
import React, {Component} from 'react'
import combinedQueries from './combinedQueries'
class Test extends Component {
...
render() {
...
if(!this.props.combinedQueries.loading) {
console.log(this.props.combinedQueries.apps);
console.log(this.props.combinedQueries.subjects);
}
...
}
}
export default graphql(combinedQueries, {name: 'combinedQueries'})(Test);
My preferred way is to use the compose
functionality of the apollo client (docu).
EDIT: If you have more than one query you should name them.
So in your case, it could look like this:
import React, {Component} from 'react'
import queries from './queries'
import { graphql, compose } from 'react-apollo';
class Test extends Component {
...
render() {
...
console.log(this.props.subjectsQuery, this.props.appsQuery); // should show both
...
}
}
export default compose(
graphql(queries.getSubjects, {
name: "subjectsQuery"
}),
graphql(queries.getApps, {
name: "appsQuery"
}),
)(Test);