我从本教程开始学习graphql和reactjs并对其进行了修改。现在,我在尝试调用GQL时会遇到此错误:GraphQl错误
这是执行呼叫的类:
import React from 'react';
import gql from 'graphql-tag';
import { graphql } from 'react-apollo'
class BookForm extends React.Component {
constructor(props) {
super(props);
this.state = {
title: '',
author: '',
src: '',
};
this.handleChange = this.handleChange.bind(this);
this.handleSubmit = this.handleSubmit.bind(this);
}
handleChange(event) {
this.setState({[event.target.name]: event.target.value });
}
handleSubmit = (e) => {
this.props.addBook({
variables: {
author: this.state.author,
title: this.state.title,
src: this.state.src
}
});
}
render() {
return (
<form className="book__form" onSubmit={this.handleSubmit}>
<label>
Title:
<input type="text" name="title" value={this.srtate.title} onChange={this.handleChange} />
</label>
<label>
Author:
<input type="text" name="author" value={this.state.author} onChange={this.handleChange} />
</label>
<label>
Src:
<input type="text" name="src" value={this.state.src} onChange={this.handleChange}/>
</label>
<label>
<input type="submit" value="Submit" />
</label>
</form>
);
}
}
const addBook = gql `mutation addBook ($author: String!, $title: String!, $: ID!) {
addBook(author: $author, title: $title, src: $src) {
id,
author,
title,
src,
}
}`
const addBookWithMutation = graphql(addBook)(BookForm);
export default addBookWithMutation;
查询graphQl返回所有数据,但是现在,当我尝试添加新数据时,我就无法获得任何数据。我在代码中做错了什么,还是GraphQL-TAG的问题?
谢谢
似乎存在一个兼容性问题,其中graphql-js的0.13.1折断了graphql-tag。您可以通过手动解决版本控制问题来解决 -
yarn add apollo-boost@0.1.1 graphql@0.13.0 react-apollo@2.0.4
供参考,这是GitHub上的问题