Line Numbers not rendering to gutter correctly. about react-codemirror HOT 10 CLOSED

Use refresh or autorefresh , I require autorefresh.js and set option autoRefresh to true solved it. For more details

from react-codemirror.

Did you guys really solve this problem ?

I used autoRefresh: true and import 'codemirror/addon/display/autorefresh'; , wrong rendering still remains.

from react-codemirror.

I tried refresh() instead and it worked.

Something like this:
componentDidMount() { this.refs.editor.getCodeMirror().refresh(); };

from react-codemirror.

Figured this out and it worked for me

The component that you are using CodeMirror in should look something like this:

class RefreshExample() {

  componentDidMount() {
    this.refs.editor.getCodeMirror().refresh(); 
  }

  render() {
    var options = {
      lineNumbers: true,
    };

    return (
        <CodeMirror ref="editor" options={options} />
    );
  }

}

You need to use ref="editor" to then call this.refs.editor.getCodeMirror().refresh();

from react-codemirror.

Thanks @Pau1fitz it worked for me too

from react-codemirror.

Has anyone been able to figure this out completely? I am too running into this issue.

from react-codemirror.

I have the same issue too.

from react-codemirror.

See http://dorianpula.ca/2015/10/07/adding-a-code-editor-to-rookeries/ for a possible answer. Dorian's suggestion worked for me. But highlighting is still MIA.

from react-codemirror.

Should have read the example more carefully. The css in he example (https://github.com/JedWatson/react-codemirror/blob/master/example/src/example.less) includes the necessary css. Still looking for an answer to the highlighting issue - probably not specifying some option.

from react-codemirror.

I have the same issue even if I loaded the codemirror.css

from react-codemirror.