2015-09-07 251 views
0

我使用的代碼鏡像在Extjs5的應用程序,以主題爲「ABCDEF」激活我怎麼能在默認情況下,在CodeMirror代碼顏色(高亮)

然而,代碼文本只是白色的,沒有顏色。

如何在默認情況下激活CodeMirror中的代碼顏色(突出顯示)。

爲了更好的情境看到這個Post

編輯

我多行文本:

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> 
+0

您加載並啓用語言模式嗎?即加載實現你正在使用的語言的腳本,並設置'mode'選項。 (並確保在初始化編輯器之前已經加載了模式腳本。) – Marijn

+0

感謝Marijn尋求幫助。我用我的代碼編輯我的帖子。我嘗試過使用各種模式而沒有成功。我無法理解我的代碼中是否有問題或缺少一些CodeMirror文件。 – josei

+0

我在那裏的任何地方都看不到'CodeMirror/mode/javascript/javascript.js'。 – Marijn

回答

1

您是否加載並啓用語言模式?即加載實現您正在使用的語言的腳本,並設置模式選項。 (並且確保在初始化編輯器之前已經加載了模式腳本。)