摩纳哥编辑器
安装&引入
npm install monaco-edito
import * as monaco from "monaco-editor";
子组建
<template>
<!-- 摩纳哥编辑器子组建 -->
<div class="the-code-editor-container" ref="container"></div>
</template>
<script>
import * as monaco from "monaco-editor";
export default {
name: "codeEditor",
props: {
options: {
type: Object,
default() {
return {
language: "yaml", // shell、sql、python
readOnly: true // 不能编辑
};
}
},
value: {
type: String,
default: "",
},
},
data() {
return {
monacoInstance: null,
provider: null,
};
},
mounted() {
this.init();
},
beforeDestroy() {
this.dispose();
},
methods: {
dispose() {
if (this.monacoInstance) {
if (this.monacoInstance.getModel()) {