@apollo/react-common
This tutorial outlines some of the @apollo/react-common API reference.
Installation
npm install @apollo/react-common
ApolloProvider
The ApolloProvider component leverages React's Context API to make a configured Apollo Client instance available throughout a React component tree. This component can be imported directly from the @apollo/react-common package where it lives, or from one of the @apollo/react-hooks, @apollo/react-components, and @apollo/react-hoc packages.
import { ApolloProvider } from '@apollo/react-hooks';
Props
OPTION | TYPE | DESCRIPTION |
---|---|---|
client | ApolloClient<TCache> | An ApolloClient instance. |
Example
ReactDOM.render(
<ApolloProvider client={client}>
<MyRootComponent />
</ApolloProvider>,
document.getElementById('root'),
);
ApolloConsumer
One way to access the configured Apollo Client instance directly is to create an ApolloConsumer component and provide a render prop function as its child. The render prop function will be called with your ApolloClient instance as its only argument. You can think of the ApolloConsumer component as similar to the Consumer component from the React Context API.
Example
import React from 'react';
import { ApolloConsumer } from '@apollo/react-common';
// or from the hooks, components, hoc packages:
// import { ApolloConsumer } from "@apollo/react-hooks";
const WithApolloClient = () => (
<ApolloConsumer>
{client => 'We have access to the client!' /* do stuff here */}
</ApolloConsumer>
);
Previous:
class ApolloClient
Next:
@apollo/react-components
- New Content published on w3resource :
- Python Numpy exercises
- Python GeoPy Package exercises
- Python Pandas exercises
- Python nltk exercises
- Python BeautifulSoup exercises
- Form Template
- Composer - PHP Package Manager
- PHPUnit - PHP Testing
- Laravel - PHP Framework
- Angular - JavaScript Framework
- React - JavaScript Library
- Vue - JavaScript Framework
- Jest - JavaScript Testing Framework