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

Question

在这个例子中,我有一个用于更新用户信息的表单,它用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.我知道我可以检索initialValues并比较所有字段.

还有另外一种方法吗？我怎样才能获得触摸的字段？

这是最好的做法吗？

在我看来,这是一个共同的任务,我没有找到任何相关的东西,所以我假设我完全忽略了这一点.

谢谢你们 :)

Answer 1

据该redux-form项目的维护者说:"这不是图书馆的一个特色".

在该响应中,他建议您自己处理差异或使用预先存在的库,例如object-diff.

例如这样:

import diff from 'object-diff'

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