Question

我有一个表单，允许用户做一些事情，如添加，删除和修改。该表单从状态中获取了大量数据initialValues，我需要一个＆＃34;撤消＆＃34;按钮，将所有修改恢复为设置initialValues时的修改方式。

还有内置于redux-form中的内容可以做到这一点吗？我们正在使用v5.3.3

Answer 1

从版本6开始，支持将redux-form还原为初始值作为开箱即用的功能。*

从redux-form文档中的Initialize from start示例中可以轻松了解。

自版本6. * redux-form传递的道具包含您只需要调用的reset函数：

  let InitializeFromStateForm = props => {
    const { handleSubmit, load, pristine, reset, submitting } = props
    return (
      <form onSubmit={handleSubmit}>
        <div>
          <button type="button" onClick={() => load(data)}>Load Account</button>
        </div>
        <div>
          <label>First Name</label>
          <div>
            <Field name="firstName" component="input" type="text" placeholder="First Name"/>
          </div>
        </div>
        <div>
          <label>Last Name</label>
          <div>
            <Field name="lastName" component="input" type="text" placeholder="Last Name"/>
          </div>
        </div>
        <div>
          <button type="submit" disabled={pristine || submitting}>Submit</button>
          <button type="button" disabled={pristine || submitting} onClick={reset}>Undo Changes</button>
        </div>
      </form>
    )
  }

如何将表单数据还原为“initialValues”

1 个答案: