Uncaught (in promise) SyntaxError: Unexpected end of JSON input at AddAutor.js:78

Question

好吧，我正在尝试在填写字段后编辑一个 autor，但是当我尝试编辑它们并保存 chenges 时出现错误，我是 React 的新手，我尝试了不同的东西，但它们没有用... 我的错误是“未处理的拒绝（SyntaxError）：JSON 输入的意外结束”。

Image of my console error

这是我执行 PUT 方法的代码：

 private handleSave(event) {
        event.preventDefault();
        const data = new FormData(event.target);

        if (this.state.autorData.idAutor) {
            fetch('api/Autor/Edit', {
                method: 'PUT',
                body: data,
            }).then((response) => {
                data.forEach(res =>
                    console.log(res));
                response.json();
            })
                .then((responseJson) => {
                    this.props.history.push("/fetchautor");
                })
        }

        // POST request for Add employee.  

        else {
            fetch('api/Autor/Create', {
                method: 'POST',
                body: data,
            }).then((response) => response.json())
                .then((responseJson) => {
                    this.props.history.push("/fetchautor");
                })
        }
    }

这是我创建表单的代码

private renderCreateForm(autorList: Array<any>) {
        return (

            <form onSubmit={this.handleSave} >
                <div className="form-group row" >
                    <input type="hidden" name="libroId" value={this.state.autorData.idAutor} />
                </div>

                <div className="container">
                    <div className="row">
                        <div className="col-sm">
                            < div className="form-group row" >
                                <label className=" control-label col-md-12" htmlFor="nombre"><b>Nombre:</b></label>
                                <div className="col-md-10">
                                    <input className="form-control" type="text" name="nombre" defaultValue={this.state.autorData.nombre} required />
                                </div>
                            </div >
                        </div>
                        <div className="col-sm">
                            < div className="form-group row" >
                                <label className=" control-label col-md-12" htmlFor="anoNacimiento"><b>Año Nacimiento</b></label>
                                <div className="col-md-10">
                                    <input className="form-control" type="text" name="anoNacimiento" defaultValue={this.state.autorData.anoNacimiento} required />
                                </div>
                            </div >
                        </div>
                            <div className="col-sm">
                            < div className="form-group row" >
                                <label className=" control-label col-md-12" htmlFor="ciudad"><b>Ciudad</b></label>
                                <div className="col-md-10">
                                    <input className="form-control" type="text" name="ciudad" defaultValue={this.state.autorData.ciudad} required />
                                </div>
                            </div >
                            </div>
                    </div>
                </div>

                <div className="form-group">
                    <button type="submit" className="btn btn-default btnCafe">Guardar</button>
                    <button className="btn btnCafe" onClick={this.handleCancel}>Cancelar</button>
                </div>

            </form>

        )``` 

Answer 1

您忘记在第一个链中返回承诺的结果。试试这个：

fetch("api/Autor/Edit", {
      method: "PUT",
      body: data
    })
    .then(response => {
      return response.json();
    })
    .then(responseJson => {
      console.log('Response as JSON', responseJson);
      this.props.history.push("/fetchautor");
    });