Question

我正在构建一个redux表单，我想创建一个»Retype Password«字段，该字段在密码字段旁边呈现。我有这段代码：

const renderRow = (field) => {
  return (
    <div className={`form-row ${field.type}`}>
      <label>{field.label}</label>
      <Field field={field} component={renderPassword} name={field.name} />
    </div>
  );
}


const renderPassword = ({field, input, meta: { error, touched }}) => {
  return (
    <div className="password-inputs-wrap">
      <input type="password" {...input} />
      <input type="password" {...input} name="password-retype" />
      {touched && error && <RenderError error={error} />}
    </div>
  );
}

现在这会呈现两个密码字段，但更改一个密码字段会同时更改另一个密码字段。

此处renderRow有点简化，因为该字段的组件未按此处显示进行硬编码。所以这个密码字段是一个例外，因为它由两个<input>组成。对于由单个<input> / <select />等组成的所有其他字段，它可以正常工作。

我怎样才能将这个重新输入<input>与第一个重新分开？

Answer 1

您需要两个字段（两个Field s）。

Redux-Form-创建密码字段»retype«

1 个答案: