In this example, I have shared how to use onBlur with JSX and React? You need a flag to track “and I validating”, which you would set to true on blur. You can set this to false on focus if you want, depending on your desired behavior.
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 | handleBlur: function () { this.setState({validating: true}); }, render: function () { return <div> ... <input type="password" placeholder="Password (confirm)" valueLink={this.linkState('password2')} onBlur={this.handleBlur} /> ... {this.renderPasswordConfirmError()} </div> }, renderPasswordConfirmError: function() { if (this.state.validating && this.state.password !== this.state.password2) { return ( <div> <label className="error">Please enter the same password again.</label> </div> ); } return null; }, |
If you like this question & answer and want to contribute, then write your question & answer and email to freewebmentor[@]gmail.com. Your question and answer will appear on FreeWebMentor.com and help other developers.
