react ace

Реагировать

Набор компонентов React для ACE

Примечание для версии 8! : Мы остановили поддержку Brace и теперь используем Ace-Builds. Пожалуйста, прочитайте документацию о том, как мигрировать. Примеры обновляются.

Демо реагированного туза

Демонстрация React Ace Split Editor

Демонстрация редактора React Ace Diff

Установить

npm install react-ace ace-builds

yarn add react-ace ace-builds

Основное использование

 import React from "react" ;
import { render } from "react-dom" ;
import AceEditor from "react-ace" ;

import "ace-builds/src-noconflict/mode-java" ;
import "ace-builds/src-noconflict/theme-github" ;
import "ace-builds/src-noconflict/ext-language_tools" ;

function onChange ( newValue ) {
  console . log ( "change" , newValue ) ;
}

// Render editor
render (
  < AceEditor
    mode = "java"
    theme = "github"
    onChange = { onChange }
    name = "UNIQUE_ID_OF_DIV"
    editorProps = { { $blockScrolling : true } }
  /> ,
  document . getElementById ( "example" )
) ; 

Примеры

Осмотрите example каталог для рабочего примера с использованием WebPack.

Документация

ACE Редактор

Редактор сплит -просмотров

Редактор DIFF

Как добавить режимы, темы и обработчики клавиатуры

Часто задаваемые вопросы

Мигрировать в версию 8

Покровители

Поддержите нас ежемесячным пожертвованием и помогите нам продолжить нашу деятельность. [Станьте покровителем]

Спонсоры

Станьте спонсором и получите свой логотип на нашем Readme на GitHub по ссылке на ваш сайт. [Станьте спонсором]