Reduxフォーム - すべての入力が満たされるまでボタンを無効にする方法？

Question

私は反応し-Reduxのフォームの例次の勉強しています：

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

ユーザが少なくとも入力を満たした場合、submit buttonが有効になっている、このように動作します。あるかどう

私はちょうど不思議、にどのような方法は、すべての入力が満たされた場合にのみ、ボタンを有効にしますか？

私はここでコード全体を貼り付けません。なぜなら、最初は長く、次にライブプレビューの例だからです。

ありがとうございました！

Answer 1

pristineまたはdirtyのようなプロパティはありませんが、レデューサーフォームを使用できます。あなたは6+このような何かが動作するはずReduxのフォームを使用していると仮定すると：

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のストアにフォームに関するすべての情報を保持しています。標準のconnect機能を使用して、その情報を任意のコンポーネントに接続することができます。 この例では、すべてのフィールドに値があるかどうかを確認するためにfieldsおよびvaluesプロパティを使用しています。