与Sublime，Vim和TextMate等本机编辑器的功能和性能相匹配
    可以轻松地嵌入任何网页和JavaScript应用程序中
    React-Ace是Ace 的react 封装版本，使用简单，方便配合form表单使用

    代码提示自动补全
    修改代码补全内容、获取代码
    获取代码格式报错信息
    高亮并且添加自定义补全代码
    设置代码内容（json)

    1. import AceEditor from 'react-ace'; // 引用实例
    2. import 'brace/mode/twilight'; // 引用自定义主题
    3. import 'brace/mode/c_cpp'; // 定义为c_cpp代码高亮
    4. import 'brace/ext/language_tools'; // 增加代码提示
    6. // 增加需要自定义的代码提示
    7. const completers = [
    8.   {
    9.     name: 'word',
    10.     value: 'word',
    11.     score: 100,
    12.     meta: 'keyword'
    13.   }
    14. ];
    16. function App() {
    17.   const complete = editor => {
    18.     editor.completers.push({
    19.       getCompletions: function (editors, session, pos, prefix, callback) {
    20.         callback(null, completers);
    21.       }
    22.     });
    23.   };
    26.   return (
    27.     <AceEditor
    28.       className={styles.codeEditor}
    29.       mode="c_cpp"
    30.       name="UNIQUE_ID_OF_DIV"
    31.       setOptions={{
    32.         enableBasicAutocompletion: false,
    33.         enableLiveAutocompletion: true,
    34.         enableSnippets: false,
    35.         showLineNumbers: true,
    36.         tabSize: 4
    37.       }}
    39.       style={{ height: '98%', fontSize: '12px', border: '1px solid #d9d9d9' }}
    41.       theme={theme}
    42.       value={code}
    43.       width={width === 0 ? '100%' : `${width}px`}
    44.       onLoad={complete}
    46.     />
    47.   );
    48. }

    https://blog.csdn.net/wsh2467991332/article/details/90904332
    https://blog.csdn.net/chenlincc/article/details/106789070
    https://blog.csdn.net/qq_36598097/article/details/105700261