javascript - 将表单 onSubmit 委托(delegate)给 Flux Actions 的集中函数

Question

我有一个包含许多不同表单的 React 应用程序，我希望不必为每个表单一遍又一遍地编写相同的代码，并且我正在寻找一种简单的方法来集中 onSubmit() 所有表单的处理程序。我可以从中心位置触发特定的 Flux 操作，从而触发 ajax 调用。

我正在想象一个处理所有表单请求的函数。

function (event) {
  event.preventDefault()
  var $elm = $(event.target)
  var d = {}
  d.method = $elm.attr('method')
  d.action = $elm.attr('action')
  d.data = $elm.serialize()
  console.log(d)
}

从这里我可以检查操作和方法并针对每种可能性进行切换。

这在 Flux 架构中有意义吗？

Answer 1

无论如何，您都需要从特定组件收集数据，因此您必须为其编写单独的函数，但其​​余任务(例如发送 action)可以在 onSubmit 中完成 父组件的函数。因此，通过 props 将子组件中所有带有数据的 onSubmit 事件委托(delegate)给父组件的 onSubmit 函数。

您还可以添加一个标识符，就像我们在调度程序中添加常量一样，以识别特定的onSubmit事件，然后在父组件中使用switch基于标识符发送特定操作的语句。

如果有用例，我想这是有道理的。