如何在摩纳哥编辑器中添加、删除和更改字形

Question

我可以向编辑器添加字形，但无法删除和编辑字形。你能告诉我正确的做法吗？

<h2>Monaco Editor Sample</h2>
<div id="container" style="width:80%;height:600px;border:1px solid grey"></div>

<!-- OR ANY OTHER AMD LOADER HERE INSTEAD OF loader.js -->
<script src="../node_modules/monaco-editor/min/vs/loader.js"></script>
<script>
    var editor,decorations;
    require.config({ paths: { 'vs': '../node_modules/monaco-editor/min/vs' }});
    require(['vs/editor/editor.main'], function() {
         editor = monaco.editor.create(document.getElementById('container'), {
            value: [
                'function x() {',
                '\tconsole.log("Hello world!");',
                '}',
            ].join('\n'),
            language: 'javascript',
            theme: "myCustomTheme",
            automaticLayout: true,
            readOnly: false,
            mouseWheelZoom:true,
            glyphMargin:true,
            fontSize:'20px'
        });
   //below is the glyph I am calling
    var decorations = editor.deltaDecorations([], [     
    {
        range: new monaco.Range(3,1,3,1),
        options: {
            isWholeLine: true,
            className: 'myContentClass',
            glyphMarginClassName: 'glyph-error',
        }
    }
    ]);
    });
</script>

我正在尝试使用 decorations 变量删除或修改字形的范围和样式，但它是一个字符串对象。

这是我的编辑器使用方形字形的样子：

Answer 1

deltaDecorations 的 return 值是一个字符串数组。每个字符串都是由上次 deltaDecorations 调用创建的装饰的标识符。

要修改现有装饰，您必须将其替换为新装饰，如下所示。

var decorations = editor.deltaDecorations([], [     
    {
        range: new monaco.Range(3,1,3,1),
        options: {
            isWholeLine: true,
            className: 'myContentClass',
            glyphMarginClassName: 'glyph-error',
        }
    }
]);

// Now move the previously created decoration to line 2
var targetId = decorations[0];
editor.deltaDecorations([targetId], [     
    {
        range: new monaco.Range(2,1,2,1),
        options: {
            isWholeLine: true,
            className: 'myContentClass',
            glyphMarginClassName: 'glyph-error',
        }
    }
]);

如何在摩纳哥编辑器中添加、删除和更改字形

How to add, remove and change glyphs in Monaco Editor

javascript

editor

monaco-editor