为什么我不能使用 Apollo Link State 添加 Todo？

Question

永远不会添加待办事项。可见性过滤器有效，远程 Coinbase 提取有效。

这是我的回购

https://github.com/deadcoder0904/apollo-coinbase

& 这是相同的代码沙箱

https://codesandbox.io/s/github/apollographql/apollo-link-state/tree/master/examples/todo

该示例类似于 codesandbox 示例，其中只有 Remote URI 用于从 coinbase APIs 获取一些硬币

我复制了同样的例子

只有 2 个变化

第一个变化是我添加了一个 HTTPLink 用于使用 Coinbase 获取远程数据 API

第二个变化是我没有使用 Apollo-Boost 并显式导入了其他所有内容

我不明白其中的区别，因为代码在字面上是相似的（幸好他们使用的是 apollo-boost 并且我使用了不同的每个块并一起吞噬）

addTodo 突变在 TodoForm.js 个人中不起作用 :)

TodoForm.js

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

const ADD_TODO = gql`
  mutation addTodo($text: String!) {
    addTodo(text: $text) @client {
      id
    }
  }
`;

const TodoForm = () => (
  <Mutation mutation={ADD_TODO}>
    {addTodo => {
      let input;
      return (
        <form
          onSubmit={e => {
            e.preventDefault();
            if (!input.value.trim()) return;
            addTodo({ variables: { text: input.value } });
            input.value = "";
          }}
        >
          <input
            type="text"
            ref={node => {
              input = node;
            }}
          />
          <button type="submit">Add Todo</button>
        </form>
      );
    }}
  </Mutation>
);

export { TodoForm };

错误是-

[Network error]: TypeError: Object(WEBPACK_IMPORTED_MODULE_0_graphql_tag["gql"]) is not a function. (In 'Object(WEBPACK_IMPORTED_MODULE_0_graphql_tag["gql"])(_templateObject)', 'Object(WEBPACK_IMPORTED_MODULE_0_graphql_tag["gql"])' is an instance of Object) on App.js:46

Answer 1

它认为 gql 不是函数（可能未定义）。应该很容易打印出来看看。如果您的 graphql-tag 版本有问题，我不会感到惊讶。在package.json

中将其设置为固定版本

Answer 2

找到解决方案。我想我必须习惯正确阅读日志。

我在 ./resolvers/todos 文件中犯了一个小错误，其他地方都很好

我实际上将 gql 导入为命名导出，如 -

import { gql } from 'graphql-tag';

当我应该使用默认导出时 -

import gql from 'graphql-tag';

为什么我不能使用 Apollo Link State 添加 Todo？

Why can't I add a Todo using Apollo Link State?

javascript

apollo

reactjs

react-apollo

apollo-client

TodoForm.js