无法在React中使用fetch执行POST操作

Question

我正试图使用ReactJS执行POST请求，并使用Spring引导在Mongo数据库中进行更新。在编译代码的过程中，我没有收到任何错误，但在尝试执行POST操作时，我没有得到输出。当我刷新页面时，我在数据库中得到一个带有ID但没有名称的条目。

这是react应用程序的代码：

async handleSubmit(event){
event.preventDefault();
const {item} = this.state;
await fetch(`/person/new`, {
method : 'POST',
headers : {
'Accept': 'application/json',
'Content-Type': 'application/json'
},
body : JSON.stringify({item}),
});

this.props.history.push("/change");
}

Spring引导中POST的代码是：

public Integer Counter(){
List<Person> p = pr.findAll();
c = 1;
while(pr.existsById(c)) {
c++;
}
return c;
}
@PostMapping("/new")
public void insertPerson(@RequestBody Person person){
Integer id = Counter();
String name = person.getName();
pr.save(new Person(id,name));
c++;
}

这是我的网站在执行代码时的样子↓

我的网站看起来如何

请帮我做这个。

PS：DELETE操作正在运行。

Answer 1

我认为这是如何调用这个函数的问题。我建议这样调用它：onClick = { async (e) => await { this.handleSubmit(e); } }