this.code = JSON.stringify(JSON.parse(this.detailObj.params),null,'\t');
import { codemirror } from 'vue-codemirror'
import 'codemirror/theme/blackboard.css'
import 'codemirror/lib/codemirror.css'
import 'codemirror/mode/javascript/javascript.js'
import 'codemirror/addon/lint/lint.css'
import 'codemirror/addon/lint/json-lint'
import 'codemirror/addon/fold/brace-fold.js';
import 'codemirror/addon/fold/xml-fold.js';
import 'codemirror/addon/fold/indent-fold.js';
import 'codemirror/addon/fold/markdown-fold.js';
import 'codemirror/addon/fold/foldgutter.css'
import 'codemirror/addon/fold/foldcode'
import 'codemirror/addon/fold/foldgutter'
import 'codemirror/addon/fold/brace-fold'
import 'codemirror/addon/fold/comment-fold'
data() {
return {
code: '',
cmOptions: {
value: '',
mode: "application/json",
theme: 'blackboard light',
readOnly: true,
lineNumbers: true,
lineWrapping: true,
extraKeys: { Ctrl: 'autocomplete' },
autocorrect: true,
lineWiseCopyCut: true,
showCursorWhenSelecting: true,
maxHighlightLength: Infinity,
matchBrackets: true,
foldGutter: true,
autoCloseTags: true,
matchTags: { bothTags: true },
styleActiveLine: true,
smartIndent: true,
gutters: ['CodeMirror-lint-markers'],
},
}
},
<codemirror ref="mycode" :value="code" :options="cmOptions" class="code"> </codemirror>