我想用react项目创建一个Crud应用程序。我按照课程https://appdividend.com/2018/11/11/react-crud-example-mern-stack-tutorial/进行操作。当我向文档中添加新文章时,导致控制台“无法保存到数据库”
这是我在前端的代码
import { Form, Icon, Input, Button } from 'antd';
import React from 'react';
import 'antd/dist/antd.css';
import 'containers/Layout/index.style.js';
import axios from 'axios';
class Index extends React.Component {
constructor(props) {
super(props);
this.state = {
link: "",
title: "",
}
this.onChangeLink = this.onChangeLink.bind(this);
this.onChangeTitle = this.onChangeTitle.bind(this);
this.onSubmit = this.onSubmit.bind(this);
}
onChangeLink(e) {
this.setState({
link: e.target.value
});
}
onChangeTitle(e) {
this.setState({
title: e.target.value
})
}
onSubmit(e) {
e.preventDefault();
const obj = {
link: this.state.link,
title: this.state.title,
};
axios.post('http://localhost:3030/api/add', obj)
.then(res => console.log(res.data));
this.setState({
link: "",
title: "",
})
}
render() {
return (
<Form onSubmit={this.onSubmit}>
<Form.Item label="Title">
<Input placeholder="" onChange={this.onChangeTitle} />
</Form.Item>
<Form.Item label="Link">
<Input placeholder="" onChange={this.onChangeLink} />
</Form.Item>
<input type="submit" value="Submit" />
</Form>
);
}
}
export default Index;
这是我在后端的代码
router.route('/add').post(function (req, res) {
let business = new Article(req.body);
business.save()
.then(business => {
res.json({'business': 'business in added successfully'});
})
.catch(err => {
res.send("unable to save to database");
});
});
我的代码错误吗?