monaco-editor设置语言、值等

我们在使用Monaco-editor时,如何设置语言或者值呢?

我的创建实例代码:

  editor.value = monaco.editor.create(codeEditorRef.value, {
    value: props.setting.value,
    language: props.setting.language,
    theme: props.setting.theme,
    colorDecorators: true,		//颜色装饰器
    fontSize: 18,
    minimap: {
      enabled: true
    }
  })

修改编程语言

monaco.editor.setModelLanguage(toRaw(editor!.value).getModel()!, newValue.language)

切记一定使用toRaw!!!,不然页面会卡死,具体参考:

vue3使用monaco editor修改编译语言_monaco-editor languages vue-CSDN博客

两点注意:

1:若是像我上边一样,使用editor.value来接收(使用ref响应式变量),然后在使用setModelLanguage这个函数会报错。

2:toRaw(editor!.value).getModel(),使用ref响应式的时候,要用toRaw,否则页面会卡死。

修改值: 

 toRaw(editor!.value).getModel().setValue('你要设置的值')

你可能感兴趣的:(实用技巧,javascript,前端,vue.js)