Question

我使用react-admin / aor 2.0.0-beta2和ra-data-graphql以及说明here

我看到TypeError: Cannot read property 'link' of undefined

import React, { Component } from 'react';
import buildGraphQLProvider from 'ra-data-graphql';
import { ApolloClient } from 'apollo-client';
import { Admin, Resource, Delete } from 'react-admin';
import { createNetworkInterface } from 'react-apollo';
import { PostCreate, PostEdit, PostList } from './posts';
import Dashboard from './Dashboard';
import { createMuiTheme } from 'material-ui/styles';
import NotFound from './NotFound';

const theme = createMuiTheme({
  palette: {
    type: 'light', // "light" or "dark" themes
  },
});

buildGraphQLProvider({
        clientOptions: {
//              uri: 'https://api.graph.cool/simple/v2/graphcool_id', ...otherApolloOptions 
                uri: 'http://localhost:3000/graphql'
        }
});

class App extends Component {
    constructor() {
        super();
        this.state = { dataProvider: null };
    }
    componentDidMount() {
        buildGraphQLProvider()
            .then(dataProvider => this.setState({ dataProvider }));
    }

    render() {
        const { dataProvider } = this.state;

        if (!dataProvider) {
            return <div>Loading</div>;
        }

        return (
            <Admin catchAll={NotFound} theme={theme} title="Private Admin" dashboard={Dashboard} dataProvider={dataProvider}>
                <Resource name="Post" list={PostList} edit={PostEdit} create={PostCreate} remove={Delete} />
            </Admin>
        );
    }
}

export default App;

我是nodejs和reactjs的新手，并想知道需要哪些更改才能使用graphql server端点

{
  "name": "ra-beta2",
  "version": "0.1.0",
  "private": true,
  "dependencies": {
    "apollo-client-preset": "^1.0.8",
    "graphql": "^0.12.3",
    "graphql-tag": "^2.7.0",
    "ra-data-graphql": "2.0.0-beta2",
    "ra-data-json-server": "^2.0.0-beta2",
    "react": "^16.2.0",
    "react-admin": "2.0.0-beta2",
    "react-apollo": "^2.0.4",
    "react-dom": "^16.2.0",
    "react-scripts": "1.1.0"
  },
  "scripts": {
    "start": "react-scripts start",
    "build": "react-scripts build",
    "test": "react-scripts test --env=jsdom",
    "eject": "react-scripts eject"
  }
}

UPDATE1：完成App.js代码
UPDATE2：从package.json
UPDATE3：基于示例添加了ra-data-graphql-simple代码

导入React，{Component}来自＆＃39;反应＆＃39 ;; 从＆ra; data-graphql-simple＆＃39;中导入buildGraphQLProvider; 从＆＃39; react-admin＆＃39;导入{管理员，资源，删除}; 从＆＃39; apollo-client＆＃39;;
导入{ApolloClient}
导入{PostCreate，PostEdit，PostList}来自＆＃39; ./ posts＆＃39;;

const client = new ApolloClient（）;

类App扩展Component { constructor（）{ 超（）; this.state = {dataProvider：null}; } componentDidMount（）{ buildGraphQLProvider（{clientOptions：{uri：＆＃39; http://localhost:3000＆＃39;}}） .then（dataProvider =＆gt; this.setState（{dataProvider}））; }
```
render() {
    const { dataProvider } = this.state;

    if (!dataProvider) {
        return <div>Loading</div>;
    }

    return (
        <Admin dataProvider={dataProvider}>
            <Resource name="Post" list={PostList} edit={PostEdit} create={PostCreate} remove={Delete} />
        </Admin>
    );
}
```
}

导出默认App;

这是例外 -

TypeError: Cannot read property 'link' of undefined
new ApolloClient
src/aor/ra-beta2-graphql/node_modules/apollo-client/ApolloClient.js:24
  21 | var _this = this;
  22 | this.defaultOptions = {};
  23 | this.resetStoreCallbacks = [];
> 24 | var link = options.link, cache = options.cache, _a = options.ssrMode, ssrMode = _a === void 0 ? false : _a, _b = options.ssrForceFetchDelay, ssrForceFetchDelay = _b === void 0 ? 0 : _b, connectToDevTools = options.connectToDevTools, _c = options.queryDeduplication, queryDeduplication = _c === void 0 ? true : _c, defaultOptions = options.defaultOptions;
  25 | if (!link || !cache) {
  26 |     throw new Error("\n        In order to initialize Apollo Client, you must specify link & cache properties on the config object.\n        This is part of the required upgrade when migrating from Apollo Client 1.0 to Apollo Client 2.0.\n        For more information, please visit:\n          https://www.apollographql.com/docs/react/basics/setup.html\n        to help you get started.\n      ");
  27 | } 

./src/App.js
src/aor/ra-beta2-graphql/src/App.js:8
   5 |  
   6 | import { PostCreate, PostEdit, PostList } from './posts';
   7 |  
>  8 | const client = new ApolloClient();
   9 |  
  10 | class App extends Component {
  11 |     constructor() {

Answer 1

我们还没有更新说明。对于那个很抱歉。但在这里，你要混合两种方法。

你可以：

创建您自己的客户端并将其作为buildGraphQLProvider选项传递给client：

buildGraphQLProvider({ client: myClient });。

让buildGraphQLProvider为您构建它，最终传递选项以进行自定义：

buildGraphQLProvider({ clientOptions: { uri: 'https://api.graph.cool/simple/v1/graphcool_id', ...otherApolloOptions } });

请查看ApolloClient文档，了解可用选项。

我会尽快更新我们的文档

使用react-admin 2.0.0和apolloclient 2.0的ra-data-graphql问题

1 个答案: