POST 请求如何使用 Redux Form 和 Express 处理？

Question

当您使用普通 HTML 表单并提交 POST 请求时，该请求会像这样发送到快速 post 路由：

app.post('/api/items', function(req, res) {
  // req from HTML form
});

但是当您使用 Redux Forms 并且向 API 发出 POST 请求时，该请求是否会作为 post 中的请求传递路线相同？

Answer 1

使用 Redux 表单时，表单不会像经典的 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>
      )
    }
  }
)

您可以 post 您的表单值 /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)
        }
      })
  })
} />

POST 请求如何使用 Redux Form 和 Express 处理？

How are POST requests handled with Redux Form and Express?

javascript

redux

redux-form