codemirror使用總結

2021-10-14 02:41:34 字數 1392 閱讀 9954

這裡使用的是自己公司封裝的元件;直接上**吧

儲存取消

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上的動...