【问题标题】:react-apollo getClient is undefinedreact-apollo getClient 未定义
【发布时间】:2018-07-30 03:58:39
【问题描述】:

我使用 react-apollo 的方式似乎存在错误。按照文档,我正在尝试使用 Apollo 进行基本查询。这是我在查看页面时在浏览器中遇到的错误。看来 this.getClient 未定义,无法调用 watchQuery。

react-apollo.browser.umd.js:417 Uncaught TypeError: this.getClient(...).watchQuery is not a function
at GraphQL.createQuery (react-apollo.browser.umd.js:417)
at GraphQL.setInitialProps (react-apollo.browser.umd.js:404)
at GraphQL.componentWillMount (react-apollo.browser.umd.js:260)
etc...

这是评论页面的代码。我创建了一个 Review React 组件,声明一个调用 userInfo 查询的 graphql-tag,并导出连接到下面 Review 页面的 graphql 标签。

import React from 'react'
import { graphql } from 'react-apollo';
import gql from 'graphql-tag'

class Review extends React.Component {...}

const userInfoQuery = gql`
query userInfoQuery{
  userInfo {
    _id
    email
    name {
      first
      last
    }
    isVerified
  }
}`

const ReviewWithData = graphql(userInfoQuery)(Review)
export default ReviewWithData;

【问题讨论】:

标签: reactjs graphql apollo react-apollo apollo-client


【解决方案1】:

问题是我在根 index.js 文件中定义了错误的客户端。所以对于下面的代码,我导出的客户端实际上并不是正确的 Apollo 客户端。因此,第六次导入时的变量client 正在导入其他一些函数。学过的知识!应该更加小心!

import React from 'react';
import { render } from 'react-dom';
import { BrowserRouter } from 'react-router-dom'
import { ApolloProvider } from 'react-apollo';

import App from './containers/app';
import client from './services/Apollo'

const CustomerFrontendApp = (
  <ApolloProvider client={BitsyApollo.client}>
    <BrowserRouter>
      <App />
    </BrowserRouter>
  </ApolloProvider>
);

渲染(BitsyCustomerFrontendApp, document.getElementById('root'));

【讨论】:

    猜你喜欢
    • 2018-11-05
    • 2021-03-25
    • 1970-01-01
    • 2018-03-19
    • 2020-05-07
    • 2021-06-21
    • 2021-04-20
    • 2021-08-13
    • 2020-12-14
    相关资源
    最近更新 更多