Réagir: Ne pas utiliser keyUp pour les événements onChange

Est-il possible de Réagir de feu le onChange événement après le focus sur un élément est perdu plutôt que d'avoir sur keyUp (actuellement, onChange est une abstraction de tout événement qui manipule la valeur du champ)? keyUp est un peu lent pour moi, et je pense que cela peut aider le mobile expereince avec ce que je suis en train de construire pour passer de la cuisson, pour une fois que le champ est concentré.

N'est-ce pas, normalement, ce que le "onBlur" événement est pour? Je suis familier avec la Réagir cadre, mais j'imagine qu'il pourrait soutenir que, dans une certaine forme.
Est sûr. Réagir résumés des événements bien, c'est un de ces gros vue des cadres

OriginalL'auteur Kyle Hotchkiss | 2014-06-02

  1. 6

    Vous cherchez quelque chose de ce genre?

    JS Fiddle

    J'ai peut-être l'interprétation de ce que vous allez avoir tort, mais vous devriez être en mesure d'obtenir vos valeurs par e.cible.valeur ou par l'utilisation d'un ref, comme:

    <input type="text" ref="myValue" onBlur={this.handleChange} />

    et puis dans votre handleChange fonctions vous devriez avoir quelque chose comme ceci:

    handleChange: function()
{
    var theValue = this.refs.myValue.getDOMNode().value;
    //setState, etc. here
}

    OriginalL'auteur captray

  2. 1

    Vous pouvez construire votre propre composant qui prennent en charge ce problème, par exemple:

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

    Et l'utiliser à la place de React.DOM.input où vous le souhaitez.

    OriginalL'auteur tungd