REACT-ACE-EDITOR

Introduction

This is a react wrapper around the Ace Editor
Ace Editor Demo
Ace Editor Github

Getting Started

``
npm install --save react-ace-editor
`

Usage

`
import ReactAce from 'react-ace-editor';
import React, { Component } from 'react';

class CodeEditor extends Component {
contructor() {
super();
this.onChange = this.onChange.bind(this);
}
onChange(newValue, e) {
console.log(newValue, e);

const editor = this.ace.editor; // The editor object is from Ace's API
console.log(editor.getValue()); // Outputs the value of the editor
}
render() {
return (
mode="javascript"
theme="eclipse"
setReadOnly=false
onChange={this.onChange}
style={{ height: '400px' }}
ref={instance => { this.ace = instance; }} // Let's put things into scope
/>
);
}
}
``

More Documentation

For all the available method from the Ace Editor, please checkout Ace Editor's API documentation