我在Extjs5应用程序中使用Code Mirror,主题为"abcdef"
但是,代码文本只是白色的,没有颜色。
如何默认激活CodeMirror中的代码颜色(高亮显示)。
要更好地了解上下文,请参阅这篇文章
编辑
我的文本区域:
items:[{
xtype: 'textarea',
anchor:'100%',
// name: 'scripts',
itemId:'textareaItemId',
height:'100%',
autoScroll: true,
listeners: {
afterrender:function(textarea){
var editableCodeMirror = CodeMirror.fromTextArea(textarea.getEl().query('textarea')[0], {
mode: "javascript",
theme: "abcdef",
lineNumbers: true,
keyMap:"sublime",
content: '',
matchBrackets: true,
electricChars:true,
autoClearEmptyLines: true,
extraKeys: {"Enter": "newlineAndIndentContinueComment"}
});
editableCodeMirror.setSize('100%', '100%');
}
}
}],
我的itemClick方法在网格监听器:
itemclick: function(grid, record, item, index, e, eOpts ) {
var textAreaForCodeMirror = Ext.ComponentQuery.query('#textareaItemId')[0];
var editableCodeMirror = textAreaForCodeMirror.getEl( ).query('.CodeMirror')[0].CodeMirror;
editableCodeMirror.getDoc().setValue(record.get('scripts'));
},
CodeMirror文件:
<link rel="stylesheet" type="text/css" href="CodeMirror/lib/codemirror.css">
<link rel="stylesheet" type="text/css" href="CodeMirror/theme/abcdef.css">
<link rel="stylesheet" type="text/css" href="CodeMirror/theme/base16-dark.css">
<script src="CodeMirror/lib/codemirror.js"></script>
<!-- EDIT missing the following file -->
<script src="CodeMirror/mode/javascript/javascript.js"></script>
<script src="CodeMirror/addon/edit/matchbrackets.js"></script>
<script src="CodeMirror/addon/comment/continuecomment.js"></script>
<script src="CodeMirror/addon/runmode/colorize.js"></script>
<script src="CodeMirror/addon/hint/javascript-hint.js"></script>
<script src="CodeMirror/addon/hint/html-hint.js"></script>
<script src="CodeMirror/addon/hint/css-hint.js"></script>
<script src="CodeMirror/addon/hint/anyword-hint.js"></script>
<script src="CodeMirror/addon/hint/sql-hint.js"></script>
<script src="CodeMirror/addon/lint/lint.js"></script>
<script src="CodeMirror/keymap/sublime.js"></script>
是否加载并启用语言模式?也就是说,加载实现你正在使用的语言的脚本,并设置模式选项。(并且确保在初始化编辑器之前已经加载了模式脚本)