@codingame/monaco-editor-react)-

概要

此库使用 https://github.com/ CodinGame/monaco-editor-wrapper 互联网档案馆的存檔,存档日期2013-12-02

请参见本文件

安装

npm install @codingame/monaco-editor-react 

使用量

简单使用

以下是简单整合 monaco 带编辑器 React 项目. 你只需要进口和制造 Editor 组件 :

import React from "react";
import ReactDOM from "react-dom";

import Editor from "@codingame/monaco-editor-react";

function App() {
  const [value, setValue] = useState('// some comment');
  return (
   <Editor
     height="auto"
     programmingLanguage="javascript"
     value={value}
     onChange={setValue}
   />
  );
}

const rootElement = document.getElementById("root");
ReactDOM.render(<App />, rootElement);

模型管理

当您制作摩纳哥编辑器组件时,模式管理有两种模式:

• 如果该型号已经存在,则该型号将在尾端被再利用并作处置
• 如果模型不存在,它将会被创建和处理

这样,编辑器是插件和游戏,用于简单的使用大小写,但它允许您先创建模型,在编辑器中使用模型,并在您不再需要时处理模型

与 摩纳哥反应

• 此库输出一些动态 import 并依靠网络包装来处理它们
• 模型管理是不同的,要么用手管理模型,要么让编辑者创建并摧毁模型
• 没有 onValidate:可以直接用monaco.editor.on完成. 变化马克斯
• 没有主题道具: 主题可以使用 monaco.editor.setTheme
• 要获取编辑器实例, 请使用 ref 改为 handleEditorDidMount
• 没有 useMonaco,您只需使用导出 monaco数字 : import { monaco }, Editor from "@codingame/monaco-editor-react";