当您使用普通的 HTML 表单并提交 POST 请求时,该请求将被发送到 express post 路由,如下所示:
app.post('/api/items', function(req, res) {
// req from HTML form
});
但是,当您使用 Redux Forms 并向 API 发出 POST 请求时,该请求是否会以同样的方式作为 post 路由中的请求传递?
当您使用普通的 HTML 表单并提交 POST 请求时,该请求将被发送到 express post 路由,如下所示:
app.post('/api/items', function(req, res) {
// req from HTML form
});
但是,当您使用 Redux Forms 并向 API 发出 POST 请求时,该请求是否会以同样的方式作为 post 路由中的请求传递?
使用 Redux Form 时,不会像经典的 HTML 表单那样提交表单。相反,onSubmit
会触发回调(默认情况下)以提交数据。
给定以下形式:
reduxForm({
form: "form",
fields: ["foo", "bar"],
})(
class MyForm extends Component {
render() {
return (
<form onSubmit={this.props.handleSubmit}>
<input type="text" {...this.props.fields.foo} />
<input type="text" {...this.props.fields.bar} />
<button>{"Save"}</button>
</form>
)
}
}
)
您可以通过/api/items
这种方式发布表单值:
<MyForm onSubmit={
values => new Promise((resolve, reject) => {
fetch("/api/items", {method: "post", body: JSON.stringify(values)})
.then(res => res.json())
.then(res => {
if (res.hasOwnProperty("errors")) {
reject(res.errors)
} else {
resolve(res.data)
}
})
})
} />