File tree Expand file tree Collapse file tree 1 file changed +27
-7
lines changed Expand file tree Collapse file tree 1 file changed +27
-7
lines changed Original file line number Diff line number Diff line change 1
1
# Codemirror
2
2
3
- The excellent CodeMirror editor as a React.js component.
3
+ The excellent [ CodeMirror] ( https://codemirror.net ) editor as a [ React.js] ( http://facebook.github.io/react ) component.
4
4
5
5
6
6
## Demo & Examples
7
7
8
- Live demo: [ JedWatson.github.io/react-codemirror] ( http://JedWatson.github.io/react-codemirror/ )
8
+ Live demo: [ JedWatson.github.io/react-codemirror] ( http://JedWatson.github.io/react-codemirror )
9
9
10
10
To build the examples locally, run:
11
11
@@ -31,11 +31,29 @@ npm install codemirror --save
31
31
## Usage
32
32
33
33
```
34
- // TODO: value, onChange example
35
-
36
- var Codemirror = require('codemirror');
37
-
38
- <Codemirror />
34
+ var React = require('react'),
35
+ Codemirror = require('react-codemirror');
36
+
37
+ var App = React.createClass({
38
+ getInitialState: function() {
39
+ return {
40
+ code: "// Code"
41
+ };
42
+ },
43
+ updateCode: function(newCode) {
44
+ this.setState({
45
+ code: newCode
46
+ });
47
+ },
48
+ render: function() {
49
+ var options = {
50
+ lineNumbers: true
51
+ };
52
+ return <Codemirror value={this.state.code} onChange={this.updateCode} options={options} />
53
+ }
54
+ });
55
+
56
+ React.render(<App />, document.getElementById('app'));
39
57
```
40
58
41
59
### Properties
@@ -44,6 +62,8 @@ var Codemirror = require('codemirror');
44
62
* ` options ` ` Object (newValue) ` options passed to the CodeMirror instance
45
63
* ` onChange ` ` Function (newValue) ` called when a change is made
46
64
65
+ See the [ CodeMirror API Docs] ( https://codemirror.net/doc/manual.html#api ) for the available options.
66
+
47
67
### License
48
68
49
69
MIT. Copyright (c) 2015 Jed Watson.
You can’t perform that action at this time.
0 commit comments