Is it possible to have React fire the onChange
event after the focus on an element is lost as opposed to having it on keyUp
(currently, onChange
is an abstraction of any event that manipulates the field value)? keyUp
is a little slow for me, and I think it may help the mobile expereince with what I'm building to switch the firing of that to after the field is focused.
Are you looking for something like this?
JS Fiddle
I may be interpreting what you're asking for incorrectly, but you should be able to get your values via e.target.value or through using a ref, like:
<input type="text" ref="myValue" onBlur={this.handleChange} />
and then in your handleChange function you'd have something like this:
handleChange: function()
{
var theValue = this.refs.myValue.getDOMNode().value;
//setState, etc. here
}
You could build your own component that support this behavior, for example:
var ChangeOnBlurInput = React.createClass({
render: function() {
var options = this.props;
options.onBlur = options.onChange;
// You can also use `transferPropsTo` here, but I've heard it's deprecated
return React.DOM.input.call(React.DOM, options);
}
});
React.renderComponent(
ChangeOnBlurInput({
value: "Nice",
onChange: function(e) { alert(e.target.value) } }),
document.body);
And use it instead of React.DOM.input
wherever you want.
If you love us? You can donate to us via Paypal or buy me a coffee so we can maintain and grow! Thank you!
Donate Us With