Question

我正在研究反应 - 还原形式的例子：

http://redux-form.com/6.0.0-alpha.4/examples/simple/

以这种方式工作，如果用户填写至少一个输入，则submit button正在启用。

我只是想知道，是否有任何方式启用按钮仅当所有输入都被填充？

我不会在这里粘贴整个代码，因为它首先是长时间，其次是实时预览示例。

谢谢！

Answer 1

我认为没有相应的属性，例如pristine或dirty，但您可以使用表单缩减器。假设你正在使用redux form 6+这样的东西应该起作用：

connect((state) => {
  return {
    // assuming form is the reducer's name
    myForm: state.form.myForm
  }
})(

    reduxForm({
      form: 'myForm'
    })(({ handleSubmit, myForm }) => {
      // myForm.values contains all fields that have value.
      // myForm.fields contains all fields
      const len = (obj) => Object.keys(obj).length;
      const allFilled = len(myForm.values) === len(myForm.fields);
      console.log(allFilled);
      return (
        <form onSubmit={handleSubmit}>
          <Field
            name="text"
            component="input"         
          />
          <Field
            name="bar"
            component="input"          
          />
        </form>
      )
   })
);

一点点解释，redux表单由redux支持，并在redux存储中保存有关表单的所有信息。然后，您可以使用标准connect函数将该信息连接到任何组件。在此示例中，我使用fields和values属性检查所有字段是否都有值。

Redux表单 - 如何保持按钮禁用直到每个输入都被填充？

1 个答案: