這裡使用的是自己公司封裝的元件;直接上**吧
儲存取消
define([
'./libs/sql-formatter/dist/sql-formatter.min.js',
'./libs/codemirror-5.2/lib/codemirror.js',
'./libs/codemirror-5.2/mode/sql/sql.js',
'./libs/codemirror-5.2/mode/clike/clike.js',
'./libs/codemirror-5.2/addon/fold/foldcode.js',
'./libs/codemirror-5.2/addon/fold/foldgutter.js',
'./libs/codemirror-5.2/addon/fold/brace-fold.js',
'./libs/codemirror-5.2/addon/fold/comment-fold.js',
'./libs/codemirror-5.2/addon/display/autorefresh.js',
'./libs/codemirror-5.2/addon/edit/matchbrackets.js',
'./libs/codemirror-5.2/addon/selection/active-line.js',
'./libs/codemirror-5.2/addon/display/fullscreen.js',
'./libs/codemirror-5.2/addon/hint/sql-hint.js',
'./libs/codemirror-5.2/addon/hint/show-hint.js'
], function (require, exports) ;
},mounted () );
},methods: ,
'esc': function (cm)
}}, // to invoke the auto complete
hint: codemirror.hint.sql,
hintoptions:
}});
editor.setsize('90%', '200px');
editor.setoption('theme', 'idea');
// **自動提示功能,記住使用cursoractivity事件不要使用change事件,這是乙個坑,那樣頁面直接會卡死
// editor.on('cursoractivity', function () );
// });
_this.editor = editor;
});},
},
CodeMirror學習和使用
template div class in coder panel textarea ref textarea placeholder 請輸入查詢sql textarea div template script type text ecmascript 6 引入全域性例項 import codemi...
codemirror 常見操作
0.定義乙個包含codemirror的文字框 1.獲取codemirror這個物件 var editor codemirror.fromtextarea document.getelementbyid code 輸入s然後ctrl就可以彈出選擇項 mode x mysql onchange func...
關於codeMirror外掛程式使用的乙個坑
codemirror外掛程式可以做語法高亮渲染,但它操作過程是這樣的 先從 textarea中讀取值放到codemirror動態生成的div中,根據textarea中的換行個數確定行數,根據正則表達來高亮語法。這就有個問 題,當你在頁面上對語法做出修改提交表單時,其實只是在codemirror上的動...