主页 / coding / 问题 / 79568842
Accepted
erosman
Asked: 2025-04-11 20:27:00 +0800 CST

如何更改编辑器语言？

  • 772

为了重复使用编辑器dispose()而不必create()创建新的编辑器，可以使用 更改值editor.setValue()。如何更改语言（例如更改为“css”）？

const editor = monaco.editor.create(document.getElementById('container'), {
  value: ['function x() {', '\tconsole.log("Hello world!");', '}'].join('\n'),
  language: 'javascript'
});
monaco-editor

1 个回答

  1. Best Answer

    您可以使用以下setModeLanguage方法：

    monaco.editor.setModelLanguage(editor.getModel(), 'css');

    演示：

    let f = false
const b = document.querySelector('button')
b.onclick = () => monaco.editor.setModelLanguage(
    monaco.editor.getModel(model.uri), 
    (f = !f) ? 'css' : 'html'
);
    <script type="module">
  import * as monaco from 'https://cdn.jsdelivr.net/npm/[email protected]/+esm';
  
  const val = `<div>Test me</div>
window { height: 100px; }`;

  const model = monaco.editor.createModel(val, 'html');
  monaco.editor.create(document.querySelector('.monaco'), {
      model: model
  });
  
  window.monaco = monaco
  window.model = model
</script>

<link href="https://cdn.jsdelivr.net/npm/[email protected]/dist/codicon.min.css" rel="stylesheet">
<div class="monaco" style="min-height: 100px"></div>
<button>Switch between HTML and CSS</button>

    • 1

相关问题