第二个编辑器的摩纳哥代码编辑器自定义行号

Question

我在 IDE 的网页中使用 monaco 代码编辑器。

我正在为我的网络应用程序使用 React

我需要使用部分代码只读并保持可编辑。不幸的是，我在 monaco 编辑器中找不到 lineRange readOnly 选项。因此，我选择在同一页面中放置 2 个摩纳哥编辑器。

this.state.DEFAULT_CODE.map((item, key) => {return(                                                                 
    <MonacoEditor key={key}                                                                        
     height='400'                                                         
     className="codemirror1"
     language="C"
      options={options}                                                                       
       value={item.value}
      editorDidMount={(editor, monaco) => {
      this.editor = editor;
      editor.addCommand(monaco.KeyMod.CtrlCmd | monaco.KeyCode.KEY_C, () 
       => null);
     }}
    onChange={(value) => {
     this.setState({
       DEFAULT_CODE: value,
     });
    }}
   />
)

现在我希望第二个编辑器的行号从第一个编辑器的行尾开始.. 可能吗.... 如果可以，谁能帮帮我....

Answer 1

您可以使用 lineNumbers 选项。这是一个使行编号从零开始的示例：

options = {
  lineNumbers: num => num - 1,
  lineNumbersMinChars: 2,
  glyphMargin: false,
};

这是另一个将数字映射到罗马数字的示例：

const useRomanNums = (num) => {
    const map = [ 'O', 'I', 'II', 'III', 'IV', 'V', 'VI', 'VII', 'VIII', 'IX', 'X'];
    return (num < map.length) ? map[num] : num;
}

const options = {
  lineNumbers: useRomanNums
};

Answer 2

您可以很好地使用 lineNumbers 选项。

options = {
  lineNumbers: 5,
  lineNumbersMinChars: 6,
  glyphMargin: false,
};

第二个编辑器的摩纳哥代码编辑器自定义行号

Monaco code editor custom line number for the second editor

monaco-editor