kylefang/apollo
1
0
Fork 0
mirror of https://github.com/zhigang1992/apollo.git synced 2026-04-29 12:25:35 +08:00
Code Issues Packages Projects Releases Wiki Activity

Connect your API to a client Hooks changes

Browse Source
This commit is contained in:
hwillson
2019-08-04 13:40:32 -04:00
parent 4d2c68e131
commit cba0b76617
1 changed files with 5 additions and 5 deletions
Download Patch File Download Diff File Expand all files Collapse all files

10
docs/source/tutorial/client.md
View File

@@ -124,16 +124,16 @@ Go ahead and delete the `client.query()` call you just made and the `gql` import
## Connect your client to React
Connecting Apollo Client to our React app with `react-apollo` allows us to easily bind GraphQL operations to our UI.
Connecting Apollo Client to our React app with React Apollo allows us to easily bind GraphQL operations to our UI.
To connect Apollo Client to React, we will wrap our app in the `ApolloProvider` component exported from the `react-apollo` package and pass our client to the `client` prop. The `ApolloProvider` component is similar to React’s context provider. It wraps your React app and places the client on the context, which allows you to access it from anywhere in your component tree.
To connect Apollo Client to React, we will wrap our app in the `ApolloProvider` component exported from the `@apollo/react-hooks` package and pass our client to the `client` prop. The `ApolloProvider` component is similar to React’s context provider. It wraps your React app and places the client on the context, which allows you to access it from anywhere in your component tree.
Open `src/index.js` and add the following lines of code:
_src/index.js_
```jsx{1,4,6}
import { ApolloProvider } from 'react-apollo';
```jsx
import { ApolloProvider } from '@apollo/react-hooks';
import React from 'react';
import ReactDOM from 'react-dom';
import Pages from './pages';
@@ -147,4 +147,4 @@ ReactDOM.render(
);
```
Now, we're ready to start building our first `Query` components in the next section.
Now, we're ready to start building our first `useQuery` Hook based component in the next section.