58 lines
1.4 KiB
Vue
58 lines
1.4 KiB
Vue
<template>
|
||
<codemirror ref="mycode" :value="curCode" :options="cmOptions" class="code" v-show="aaa">
|
||
</codemirror>
|
||
</template>
|
||
|
||
<script>
|
||
import { codemirror } from 'vue-codemirror'
|
||
import "codemirror/theme/ambiance.css"; // 这里引入的是主题样式,根据设置的theme的主题引入,一定要引入!!
|
||
require("codemirror/mode/javascript/javascript"); // 这里引入的模式的js,根据设置的mode引入,一定要引入!!
|
||
|
||
|
||
export default {
|
||
name: 'ExecuteAction',
|
||
data() {
|
||
return {
|
||
curCode: '测试',
|
||
cmOptions: {
|
||
// autorefresh: true,
|
||
// tabSize: 4,
|
||
// mode: 'text/x-properties',
|
||
// theme: 'ayu-mirage',
|
||
// line: true,
|
||
// viewportMargin: Infinity, //处理高度自适应时搭配使用
|
||
// highlightDifferences: true,
|
||
// autofocus: false,
|
||
// indentUnit: 2,
|
||
// smartIndent: true,
|
||
// readOnly: true, // 只读
|
||
// showCursorWhenSelecting: true,
|
||
// firstLineNumber: 1
|
||
lineNumbers: true, // 显示行号
|
||
mode: 'text/x-yaml', // 语法model
|
||
gutters: ['CodeMirror-lint-markers'], // 语法检查器
|
||
theme: "ambiance",
|
||
lint: true, // 开启语法检查
|
||
}
|
||
|
||
}
|
||
|
||
},
|
||
components: {
|
||
codemirror
|
||
},
|
||
|
||
|
||
}
|
||
|
||
</script>
|
||
|
||
|
||
<style scoped>
|
||
.information-box>>>.CodeMirror {
|
||
font-family: monospace;
|
||
height: 71vh;
|
||
direction: ltr;
|
||
}
|
||
</style>
|