Skip to content

Instantly share code, notes, and snippets.

@allejo
Forked from pstoica/OnBlurComponent.jsx
Last active May 10, 2019 17:42
Show Gist options
  • Save allejo/b55269ae1dbfde4eb4689449c0c1ffca to your computer and use it in GitHub Desktop.
Save allejo/b55269ae1dbfde4eb4689449c0c1ffca to your computer and use it in GitHub Desktop.
onBlur for entire react component
var HelloMessage = React.createClass({
render: function() {
return <div tabIndex="1" onBlur={this.onBlur}>
Hello <input type="text" value="wat"/>
</div>;
},
onBlur: function(e) {
var currentTarget = e.currentTarget;
// https://stackoverflow.com/a/11592974/1239484
setTimeout(function() {
if (!currentTarget.contains(document.activeElement)) {
console.log('component officially blurred');
}
}, 0);
}
});
React.render(<HelloMessage name="John" />, mountNode);
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment