Forked from Chris Coyier's Pen BGFhn.
A Pen by Captain Anonymous on CodePen.
<div id="page"></div> |
Forked from Chris Coyier's Pen BGFhn.
A Pen by Captain Anonymous on CodePen.
var App = React.createClass({ | |
getInitialState: function() { | |
return {userInput: ''}; | |
}, | |
handleChange: function(e) { | |
this.setState({userInput: e.target.value}); | |
}, | |
clearAndFocusInput: function() { | |
this.setState({userInput: ''}); // Clear the input | |
// We wish to focus the <input /> now! | |
}, | |
render: function() { | |
return ( | |
<div> | |
<div onClick={this.clearAndFocusInput}> | |
Click to Focus and Reset | |
</div> | |
<input | |
value={this.state.userInput} | |
onChange={this.handleChange} | |
/> | |
</div> | |
); | |
} | |
}); | |
React.render(<App />, document.getElementById("page")); |
<script src="//cdnjs.cloudflare.com/ajax/libs/react/0.13.0/react.min.js"></script> | |
<script src="http://codepen.io/chriscoyier/pen/yIgqi.js"></script> |
body { | |
padding: 20px; | |
} |