在Mutation的上下文或道具中找不到“客户”

问题描述

执行我的React Native应用程序后,我遇到了以下错误Could not find "client" in the context or props of Mutation. Wrap the root component in an <ApolloProvider>,or pass an ApolloClient instance via props.

这是我的阿波罗客户

import { Platform } from "react-native";
import { ApolloClient,InMemoryCache } from "@apollo/client";

// To access our host machine and not the device itself we use a special ip on android
// If we are using IOS access localhost:4000 else use 10.0.0.2:4000
const host =
  Platform.OS === "ios" ? "http://localhost:4000" : "http://10.0.2.2:4000";

export const client = new ApolloClient({
  uri: host,cache: new InMemoryCache(),});

这是包装我的根组件的index.tsx:

import { ApolloProvider } from '@apollo/client';
import { client } from "./apollo";
import { Routes } from "./routes/index";

export default class App extends React.PureComponent {
  render() {
    return (
      <ApolloProvider client={client}>
        <Routes />
      </ApolloProvider>
    );
  }
}

解决方法

在V 3.0之前,react-apolloapollo-client(以及其他子软件包)位于单独的软件包中(与软件包版本有关的很多问题/错误。Issue 2042 -or- { {3}})。

最好的方法是迁移到 Apollo Client 3.0

react-apollo软件包已被弃用,并且该功能 上面每个软件包提供的功能现在都可以从 @ apollo /客户。 issue 2900

Apollo V3.0 出色的“入门” /教程示例+沙箱:

客户端

在您的情况下,client似乎未定义。运行并测试:

console.log(client); /* return object -or- not? */

尝试在一个文件中运行此代码(如果此代码运行良好,请分离所需的文件并使用module.exports)。

import React from "react";
import { render } from "react-dom";
import {
ApolloClient,InMemoryCache,ApolloProvider,useQuery,gql
} from "@apollo/client";


export const client = new ApolloClient({
  uri: "https://48p1r2roz4.sse.codesandbox.io",cache: new InMemoryCache()
});


export default class App extends React.PureComponent {
render() {
  return (
    <ApolloProvider client={client}>
        <h2>My first Apollo app <span>?</span></h2>
    </ApolloProvider>
  );
}
}

render(<App/>,document.getElementById("root"));