[英]Get values from Monaco Editor in Vue 2
I am new to Vuejs and have to integrate Vue2 with Monaco Editor.我是 Vuejs 的新手,必须将 Vue2 与 Monaco Editor 集成。 I want to get values input by user.
我想获取用户输入的值。 I tried few ways but cannot get the value.
我尝试了几种方法,但无法获得价值。 Thanks in advance!
提前致谢!
This is my Editor.vue file.这是我的 Editor.vue 文件。
<template>
<div id="editor" ref="editor"></div>
</template>
<script>
import * as monaco from "monaco-editor";
export default {
name: "CodeEditor",
mounted() {
const editorOptions = {
value: [
"function greeting() {",
'\tconsole.log("Test Monaco...);',
"}",
].join("\n"),
language: "text/javascript",
minimap: { enabled: false },
wordWrap: true,
automaticLayout: true,
};
window.editor = monaco.editor.create(document.getElementById("editor"), editorOptions);
},
computed: {
getUserInput() {
// how to get user input???
},
},
};
</script>
<style>
#editor {
height: 500px;
width: 100%;
overflow: hidden;
}
</style>
It is very easy to get the value with the getValue()
method that monaco editor has built-in.使用 monaco 编辑器内置的
getValue()
方法很容易获取值。
<template>
<div id="editor" ref="editor"></div>
</template>
<script>
import * as monaco from "monaco-editor";
export default {
name: "CodeEditor",
data() {
editor: null,
editorOptions: {
value: [ "function greeting() {", '\tconsole.log("Test Monaco...);', "}", ].join("\n"),
language: "text/javascript",
minimap: { enabled: false },
wordWrap: true,
automaticLayout: true
}
},
methods: {
createEditor() {
this.editor = monaco.editor.create(document.getElementById("editor"), this.editorOptions);
},
getEditorValue() {
// Returns the current editor value
return this.editor.getValue()
},
},
mounted() {
this.createEditor()
},
};
</script>
<style>
#editor {
height: 500px;
width: 100%;
overflow: hidden;
}
</style>
I set your variables in the data section and added a createEditor
and getEditorValue
method, they will help you to organize better your code.我在数据部分设置了你的变量,并添加了一个
createEditor
和getEditorValue
方法,它们将帮助你更好地组织你的代码。
声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.