CODEWITHSUNDEEP
reactjsreact-reduxreact-apollo
Ziggy
Ziggy

Reputation: 22375

Can ApolloProvider be made to provide to state instead of props?

Redux's Provider component and connect function provide a reference to the store's state to wrapped components via mapStateToProps. As mentioned in the lovely article How to Build a Redux, this is done so that you don't need to refer to a global store object or pass data endlessly down the DOM.

This has a great advantage: the store state is DOM agnostic. You can put any two elements anywhere on the page and provide them with any data you want from the store. If you have a form for customer search and a list of customer search results... the relationship of these presentational elements doesn't affect their access to data.

As far as I can tell, Apollo-react's ApolloProvider does not subscribe to this principle. When I wrap a component with a query using graphql, the results of that query are provided as props to the wrapped component. If those results are needed elsewhere in the app, they must be passed manually or stored on a global reference. In particular, props returned from a graphql query cannot be passed up the DOM.

Is there a way of making ApolloProvider "provide" query results to the rest of the app in the same way redux's Provider does? Do I need to build this functionality myself? Or, better yet, am I misunderstanding something?

Upvotes: 1

Views: 436

Answers (1)

Brandon
Brandon

Reputation: 39192

Apollo uses Redux to cache the graphql query results. Essentially if you have multiple components that need the same data, just use Apollo to wrap each of them with the same graphql query. You can even go as far as defining the graphql connector once, and using that same connector to wrap your N components.

Upvotes: 1

Related Questions