Skip to content

Instantly share code, notes, and snippets.

@insin
Last active August 29, 2015 14:23
Show Gist options
  • Save insin/9e507894f3858028c7e5 to your computer and use it in GitHub Desktop.
Save insin/9e507894f3858028c7e5 to your computer and use it in GitHub Desktop.
react-codemirror: onChange fires when value is set programmatically - http://bl.ocks.org/insin/raw/9e507894f3858028c7e5/
<meta charset="UTF-8">
<script src="https://fb.me/react-0.13.3.js"></script>
<script src="https://fb.me/JSXTransformer-0.13.3.js"></script>
<script src="https://rawgit.com/JedWatson/react-codemirror/master/dist/react-codemirror.js"></script>
<link rel="stylesheet" href="https://rawgit.com/codemirror/CodeMirror/master/lib/codemirror.css">
<div id="app"></div>
<script type="text/jsx;harmony=true">void function() { "use strict";
var valueSeed = 1
var App = React.createClass({
getInitialState() {
return {
value: 'Value ' + valueSeed
}
},
changeValue() {
this.setState({value: 'Value ' + ++valueSeed})
},
onChange(code) {
alert('onChange: ' + code)
this.setState({value: code})
},
render() {
return <div>
<Codemirror value={this.state.value} onChange={this.onChange} options={{lineNumbers: true}}/>
<button type="button" onClick={this.changeValue}>Change value</button>
</div>
}
})
React.render(<App/>, document.getElementById('app'))
}()</script>
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment