Hook 迁移指南

新的钩子API用于Apollo客户端是一个更简单的方法，在React应用程序中获取数据，而无需渲染属性组件和高层组件（HOC）的样板代码。我们建议对于所有新的Apollo代码，都使用钩子。

核心包

React钩子功能包含在Apollo客户端包中，而旧的HOC / 渲染属性组件方法则不包含在内。React团队已明确表示钩子是未来的发展方向，因此我们决定通过单独的包保留旧的方法。

• @apollo/client-Apollo客户端 核心与React钩子集成
• @apollo/react-components- React Apollo渲染属性组件
• @apollo/react-hoc - React Apollo HOC (grapqhl) API

安装/升级场景

我只想使用 Apollo 钩子

1
npm install @apollo/client

(如果之前已安装，请删除 react-apollo 和 @apollo/react-hooks 包)

我只想使用 Apollo 渲染属性组件

1
npm install @apollo/client @apollo/react-components

(如果之前已安装，请删除 react-apollo 包)

我只想使用 Apollo HOC

1
npm install @apollo/client @apollo/react-hoc

(如果之前已安装，请删除 react-apollo 包)

我想在我的应用程序中使用所有 3 种 React 模式

1
npm install @apollo/client @apollo/react-components @apollo/react-hoc

(如果之前已安装，请删除 react-apollo 和 @apollo/react-hooks 包)

服务器端渲染

React Server Side Rendering 的 getDataFromTree、getMarkupFromTree 和 renderToStringWithData 函数已经包含在 Apollo Client 3 中。如果您想使用这些函数，您需要从 @apollo/client/react/ssr 中导入它们：

1
import { getDataFromTree } from "@apollo/client/react/ssr";

测试

React 测试工具现在可以通过 Apollo Client 项目获得，但它们默认包中不包括。要访问 React 测试工具，您可以使用 @apollo/client/testing 包，例如：

1
import { MockedProvider } from '@apollo/client/testing';