当Graphiql和Altair以完全相同的突变成功时，React Apollo返回Null？

我已经在我的django-graphene GraphiQL endpoints 上测试了这个突变，并在我的apollo客户端所指向的完全相同的 endpoints 上通过Altair（graphman的postman）测试了它 . 我使用相同的格式运行相同的变异，它适用于GraphiQL和Altair - 新的数据库条目 .

通过react-apollo，它不会产生错误，我的django控制台打印： [29/Nov/2017 01:51:08] "POST /graphql HTTP/1.1" 200 75

然而实际上并没有什么能够击中数据我尝试了console.log查询，并打印出数据结构，但它应该创建的对象只是说“null” .

我重建了两次无济于事 . 这是按预期工作的Altair突变：

mutation {
  leadCreate(
    newLead:{
      firstName: "Bob",
      lastName: "Dole",
      email: "BobDole@graphql.com",
      staff: "1"
    }) {
    lead {
      id
    }
  }
}

在Altair中返回结果：

STATUS: OK  STATUS CODE: 200 TIME SPENT: 641ms

{
 "data": {
  "leadCreate": {
   "lead": {
    "id": "2773"
   }
  }
 }
}

GraphiQL中的结果相同 .

这是我的index.js中的Apollo Link设置：

const httpLink = createHttpLink({
  uri: 'http://localhost:8000/graphql',
});

const client = new ApolloClient({
  link: httpLink,
  cache: new InMemoryCache(),
});

ReactDOM.render(
  <ApolloProvider client={client}>
    <App />
  </ApolloProvider>,
  document.getElementById('root'),
);
registerServiceWorker();

我应该注意到我的所有查询都正常工作，所以我相信上述内容都是正确的 .

这是我的LeadQuickCreate.js组件：

import React, { Component } from 'react';
import { graphql } from 'react-apollo';
import gql from 'graphql-tag';
import { Button, Input } from 'antd';
import { USER_ID } from '../../Utilities/constants';

class LeadQuickCreate extends Component {
  state = {
    firstName: '',
    lastName: '',
    phone: '',
    email: '',
  };

  createLink = async () => {
    const staff = localStorage.getItem(USER_ID);
    const {
      firstName, lastName, phone, email,
    } = this.state;
    const newLead = await this.props.createQuickLead({
      variables: {
        firstName,
        lastName,
        phone,
        email,
        staff,
      },
    });
    console.log('NewLead = ', newLead);
  };

  render() {
    const {
      firstName, lastName, phone, email,
    } = this.state;
    return (
      <div>
        <div>
          <Input
            value={firstName}
            onChange={e => this.setState({ firstName: e.target.value })}
            type="text"
            placeholder="Lead's First Name"
          />
          <Input
            value={lastName}
            onChange={e => this.setState({ lastName: e.target.value })}
            type="text"
            placeholder="Lead's Last Name"
          />
          <Input
            value={phone}
            onChange={e => this.setState({ phone: e.target.value })}
            type="text"
            placeholder="Lead's Phone Number"
          />
          <Input
            value={email}
            onChange={e => this.setState({ email: e.target.value })}
            type="text"
            placeholder="Lead's email address"
          />
        </div>
        <Button type="primary" onClick={() => this.createLink()}>
          Submit
        </Button>
      </div>
    );
  }
}

const CREATE_QUICK_LEAD = gql`
  mutation CreateQuickLead(
    $firstName: String!
    $lastName: String
    $phone: String
    $email: String
    $staff: ID!
  ) {
    leadCreate(
      newLead: {
        firstName: $firstName
        lastName: $lastName
        phone: $phone
        email: $email
        staff: $staff
      }
    ) {
      lead {
        id
      }
    }
  }
`;

export default graphql(CREATE_QUICK_LEAD, { name: 'createQuickLead' })(LeadQuickCreate);

单击“提交”按钮时，控制台日志将显示以下内容：

{data: {…}}
  data:
   leadCreate:
    lead: null 
    __typename: "LeadSerializerMutation"

等等

所以我被卡住了 . 关于它丢失的任何想法？

谢谢！

编辑：Egads！在按照建议发送'correct format'表单后仔细检查响应时，我意识到"staff" const是以字符串形式提交的 . 不知道为什么我的后端没有抛出明显的错误，但在提交之前快速“parseInt（工作人员）并且它有效！