redux-form - 仅提交已编辑的字段答案

【问题标题】：redux-form - Submit only edited fieldredux-form - 仅提交已编辑的字段
【发布时间】：2017-02-09 21:48:00
【问题描述】：

在这个例子中，我有一个更新用户信息的表单，它是用 React 和 redux-form 6.5 编写的。我是这个堆栈的新手。

渲染表单函数是这样的：

render() {
    const { handleSubmit } = this.props;        
    return (
      <form onSubmit={handleSubmit(this.handleFormSubmit.bind(this))}>
        <Field name="name" component="input" type="text"/>
        <Field name="surname" component="input" type="text"/>
        <button action="submit">Sign in</button>
      </form>
    );

我有 reduxForm 连接：

const extendedComponent = reduxForm({
  form: 'userdetail',
  validate
})(UserDetail);

我有提交处理程序：

 handleFormSubmit(user) {
    // TODO: how can I get only the touched fields?
    this.props.updateUser(user);
  }

验证后我正确接收到对象用户，我发送 PUT 调用，一切正常。

但我不喜欢发送 PUT 中的所有数据，我的愿望是只将编辑后的数据发送到 PUT。我知道我可以检索初始值并比较所有字段。

还有其他方法吗？我怎样才能只获得触摸的字段？

执行此操作的最佳做法是什么？

在我看来这是一项常见的任务，但我没有找到任何相关信息，所以我假设我完全没有抓住重点。

谢谢大家:)

【问题讨论】：

标签： javascript forms reactjs redux-form

【解决方案1】：

根据redux-form项目的维护者："That's not a feature of the library"。

在该回复中，他建议自己处理差异或使用预先存在的库，例如 object-diff。

例如这样：

import diff from 'object-diff'

handleFormSubmit(user, dispatch, props) {
  const { initialValues } = props 
  const changedValues = diff(initialValues, user)
  this.props.updateUser(changedValues);
}

【讨论】：

谢谢，我想念这个问题。