reactjs - Redux 表单预填充数据

Question

我正在使用 redux 表单，在加载组件时，我从 api 响应获取文本字段的值，当我填充并提交这些值时，因为我没有触及这些字段 - 我看到验证错误 -就像它们是空的一样 - 如何将这些现有值传递给 props？

const emailValfromapi = this.props.data && this.props.data.email ? this.props.data.email : [];
    const { handleSubmit, fields: { email, abc, def, etc } } = this.props;
            <fieldset className="form-group">
                          <div className="input-wrapper">
                            <input value={emailValfromapi} id="email" {...email} type="email" className={email.touched && email.error ? 'error-red' : ''} required />
                            <label className="input-label" htmlFor="Email">To</label>
                            { email.touched && email.error && <div className="alert-danger"> { email.error } </div> }
                          </div>
                        </fieldset>

Answer 1

在 redux-form 中，您不会自己传递输入值，而是使用 the Field component包装输入并让库处理数据绑定(bind)。在这种情况下，输入已填充，但 redux-form 不知道它的存在，因为它没有包装在 Field 组件中。此示例为您提供了 Field 组件的基本使用概要。

此外，要将初始值传递给表单组件，您需要使用 initialValues 属性(最好由 this example 描述)。

希望这有帮助!