mirror of
https://github.com/zebrajr/react.git
synced 2026-01-15 12:15:22 +00:00
Update examples to use onInput instead of onKeyUp
onInput has the advantage that it responds to repeated key events before onKeyUp and is called when modifying the input without the keyboard (such as pasting with the mouse). Test Plan: Opened the ballmer-peak example and docs homepage in Chrome and checked that both examples update whenever the text is changed.
This commit is contained in:
@@ -11,14 +11,14 @@ var MarkdownEditor = React.createClass({\n\
|
||||
getInitialState: function() {\n\
|
||||
return {value: 'Type some *markdown* here!'};\n\
|
||||
},\n\
|
||||
handleKeyUp: React.autoBind(function() {\n\
|
||||
handleInput: React.autoBind(function() {\n\
|
||||
this.setState({value: this.refs.textarea.getDOMNode().value});\n\
|
||||
}),\n\
|
||||
render: function() {\n\
|
||||
return (\n\
|
||||
<div className=\"MarkdownEditor\">\n\
|
||||
<h3>Input</h3>\n\
|
||||
<textarea onKeyUp={this.handleKeyUp} ref=\"textarea\">\n\
|
||||
<textarea onInput={this.handleInput} ref=\"textarea\">\n\
|
||||
{this.state.value}\n\
|
||||
</textarea>\n\
|
||||
<h3>Output</h3>\n\
|
||||
|
||||
@@ -33,7 +33,7 @@ var BallmerPeakCalculator = React.createClass({
|
||||
<h4>Compute your Ballmer Peak:</h4>
|
||||
<p>
|
||||
If your BAC is{' '}
|
||||
<input ref="bac" type="text" onKeyUp={this.handleChange} value={this.state.bac} />
|
||||
<input ref="bac" type="text" onInput={this.handleChange} value={this.state.bac} />
|
||||
{', '}then <b>{pct}</b> of your lines of code will have bugs.
|
||||
</p>
|
||||
</div>
|
||||
|
||||
Reference in New Issue
Block a user