2017-01-11 19 views
3

私は送信ボタンと通常のhtmlボタンを備えたreduxフォームを持っています。私は通常のボタンが押されたときにフォームを検証する必要はありません。しかし、フォームは常に一度検証され、次にボタンをクリックすると、ボタンのonclickが実行されるように見えます。これをどうやって防ぐのですか?Reduxフォームは、通常のボタン・プレスでも常に有効です

同じ問題を同じフォームで複製しました。たとえば、http://redux-form.com/6.4.3/examples/syncValidation/に行く場合は、年齢フィールドに4を入力し、値をクリアします。最初に検証がトリガされ、ボタンのアクションが停止します。 2回目のボタンアクション、つまりフォームの値はクリアされます。

+0

私はボタンが問題ではないと思います。私が見る限り、彼らはちょうど普通のhtmlボタンです。一つは、他の 'ボタン 'を' submit'するタイプです。フォームの 'onSubmit'ハンドラを最初に起動する必要があります。あなたが見ていると思うのは、ぼかし、つまりフォーカスが失われたときのフォームフィールドの検証です。これは無効な値を入力し、画面上の他の場所(「クリア」ボタンのような)をすぐにクリックすると起こります。これは、ボタンイベントに作用する前に入力を瞬間的に検証します。 –

+0

ありがとうございます。しかし、最初の例のサンプルでわかるように、「クリア」アクションは実行されません。フォームをクリアするには、クリアボタンを2回押してください。これを回避/回避するにはどうすればよいですか? – Srini

+0

私は繰り返し試してみましたが、ほとんどの場合、一度クリックするだけでクリアしました。時には2回クリックする必要がありましたが、私はどの状況下で見つけることができるかを見ていきます。 –

答えて

0

デフォルトでは、Reduxフォームは、ぼかしイベントのタッチフィールドの検証機能を呼び出します。ボタンをクリックしているという事実は無関係です。要素のどこかをクリックしてページのどこかをクリックすれば、その動作を得ることができます。

この動作を停止する唯一の方法は、ぼかしイベントでReduxフォームがフィールドに触れないようにすることです。これを行うには、Reduxフォーム設定オブジェクトでtouchOnBlurfalseに設定します。

export default reduxForm({ form: 'myForm', touchOnBlur: false })(MyForm); 
+0

提案していただきありがとうございます。しかし、これは私がぼかしの検証を失うことを意味します。検証が行われることに同意しますが、なぜアクションが停止するのでしょうか。必要なイベントを実行するには、このボタンを2回押す必要があります。私のボタンは、フォームの一部ではなく、フォームの外にあり、クリックすると、フォーム上のエラーで無関係に、関数onClickを呼び出す必要があります。 – Srini

関連する問題