1、codemirror是插件要自行安裝，後導入再使用
<template slot-scope="scope" slot="htmltext"> <!-- 富文本編輯--> <codemirror ref="myCm" v-model="form.htmltext" :value="scope.htmltext" :options="cmOptions" class="code"></codemirror> </template>/* 代碼編輯插件 */ import { codemirror } from 'vue-codemirror' import 'codemirror/lib/codemirror.css' import 'codemirror/theme/darcula.css' Vue.use(codemirror) /* 富文本編輯插件 */ import AvueUeditor from 'avue-plugin-ueditor' Vue.use(AvueUeditor); /* 代碼編輯插件可擴展 */ /* 開始 */ import 'codemirror/mode/htmlmixed/htmlmixed' import 'codemirror/mode/javascript/javascript' import 'codemirror/theme/monokai.css' import 'codemirror/addon/merge/merge.js' import 'codemirror/addon/merge/merge.css' import DiffMatchPatch from 'diff-match-patch' require("codemirror/mode/python/python.js") require('codemirror/addon/fold/foldcode.js') require('codemirror/addon/fold/foldgutter.js') require('codemirror/addon/fold/brace-fold.js') require('codemirror/addon/fold/xml-fold.js') require('codemirror/addon/fold/indent-fold.js') require('codemirror/addon/fold/markdown-fold.js') require('codemirror/addon/fold/comment-fold.js'){ label: "廣告代碼", prop: "htmltext", formslot: true, span: 24, rules: [{ required: true, message: "請輸入廣告代碼", trigger: "blur" }] },2、函數驗證是否是HTML格式的代碼，自行調用
//檢查html格式 checkHtml(htmltext) { if ( htmltext.indexOf("<html") > -1 && htmltext.indexOf("</html>") > -1 && htmltext.indexOf("<body>") > -1 && htmltext.indexOf("</body>") > -1 && (htmltext.indexOf("${") > -1 && htmltext.indexOf("}") > -1) ) { return true; } return false; },