Javascript Redux表单-如何保持按钮处于禁用状态，直到填写完所有输入？

我正在研究以下react redux表单示例：

它是这样工作的，如果用户至少填写一个输入，则启用提交按钮

我只是想知道，是否只有在所有输入都被填满的情况下才有办法启用按钮

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

---

谢谢大家!

我不认为有这样的属性，比如

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>
      )
   })
);

connect（（状态）=>{
返回{
//假设form是减速器的名称
myForm:state.form.myForm
}
})(
红肿({
表格：“我的表格”
})（{handleSubmit，myForm}）=>{
//myForm.values包含所有具有值的字段。
//myForm.fields包含所有字段
常量len=（obj）=>Object.keys（obj.length；
const allFilled=len（myForm.values）==len（myForm.fields）；
控制台日志（全部填充）；
返回(
)
})
);

稍微解释一下，redux表单由redux支持，并将有关表单的所有信息保存在redux存储中。然后，您可以使用标准的

connect

功能将该信息连接到任何组件。

---

在本例中，我使用

字段

和

值

属性检查所有字段是否都有值

为什么不呢？你不知道什么时候所有的字段都填好了吗？

allFilled

变量只有在该值为真时才为真，您可以使用它来启用/禁用按钮。我也遇到了同样的问题，最终提出了这个解决方案，希望它能有所帮助。