[转] CodeMirror基本配置项

原文地址: https://blog.csdn.net/qq_35372389/article/details/106540469

editor = CodeMirror.fromTextArea(document.getElementById("textarea"), {extraKeys: {                    //  配置按键"Ctrl": "autocomplete",  // 需要下面的synonyms配置},lineNumbers: true,              // 显示行号lineWrapping: true,             // 自动换行styleActiveLine: true,          // 选中行高亮mode: "text/javascript",theme: "idea",                  // 主题配置matchBrackets: true,            // 匹配括号hintOptions: {hint: synonyms},  // 自动提示配置gutters: ["CodeMirror-lint-markers"],lint: true,                     // 代码出错提醒indentUnit: 4,                  // 缩进配置（默认为2）});// 自动提示需要支持Pormise， 当当前数据的字符串满足comp中的某一个word时，会提示该word所在数组的词汇if (typeof Promise !== "undefined") {comp = [["here", "hither"],["asynchronous", "nonsynchronous"],["completion", "achievement", "conclusion", "culmination", "expirations"],["hinting", "advive", "broach", "imply"],["function","action"],["provide", "add", "bring", "give"],["synonyms", "equivalents"],["words", "token"],["each", "every"],];}// 提示功能的代码， 可以适当修改来满足自己的需求function synonyms(cm, option) {return new Promise(function(accept) {setTimeout(function() {var cursor = cm.getCursor(), line = cm.getLine(cursor.line)var start = cursor.ch, end = cursor.chwhile (start && /\w/.test(line.charAt(start - 1))) --startwhile (end < line.length && /\w/.test(line.charAt(end))) ++endvar word = line.slice(start, end)for (var i = 0; i < comp.length; i++) if (comp[i].indexOf(word) != -1)return accept({list: comp[i],from: CodeMirror.Pos(cursor.line, start),to: CodeMirror.Pos(cursor.line, end)})return accept(null)}, 10)})}// 额外配置快捷键editor.addKeyMap({'Ctrl-S': function () {saveFunction();},'Ctrl-s': function () {saveFunction();},'Ctrl-f': autoFormatSelection,});//  自动格式化编辑器function autoFormatSelection() {CodeMirror.commands["selectAll"](editor);var range = getSelectedRange();editor.autoFormatRange(range.from, range.to);editor.commentRange(false, range.from, range.to);}// 获取编辑器中选中范围的的行号function getSelectedRange() {return {from: editor.getCursor(true),to: editor.getCursor(false)}}editor.replaceSelection("内容");   // 替换选中的字符串、在光标处插入字符editor.setSize('100%', '100%');     //设置代码框的长宽CodeMirror.commands["selectAll"](editor);    // 执行内置的命令CodeMirror.commands["goDocEnd"](editor)  //移动到文件尾部editor.refresh();        // 插件不显示文本内容，直到点击才出现

[转] CodeMirror基本配置项相关推荐

codemirror java代码_codemirror使用(示例代码)
JS使用使用bower下载 javascript bower i codemirror 引入样式文件 html 引入js文件 html 文档结构 html 初始化 javascript // mod ...
在线代码编辑器 CodeMirror 使用简介
在线代码编辑器 CodeMirror 使用简介 CodeMirror是一款在线的支持语法高亮的代码编辑器 github源码特点: 支持100多种语言支持多语言混合代码自动提示代码折叠键盘绑定 ...
codemirror mysql_Angular6 CodeMirror在线编辑sql 智能提示
1. 安装ng2-codemirror包.codemirror包 npm install ng2-codemirror -- save npm install codemirror -- save 2 ...
基于 Vue + Codemirror 实现 SQL 在线编辑器
一.项目介绍本项目是基于 Vue2 + Codemirror 开发的 Web 版 SQL 编辑器,提供了以下功能: 在线运行 SQL 语句实时命令提示(支持表名.字段名.SQL关键词提示) 查看 ...
legend位置 pyecharts_可视化入门 | pyecharts全局配置项详解
更多文章,请见: http://mp.weixin.qq.com/mp/homepage?__biz=MzIxODczMDUwOA==&hid=2&sn=7928727456d4903 ...
CodeMirror 5.26.0 发布，在线代码编辑器
CodeMirror 5.26.0 已发布,CodeMirror 是一款"Online Source Editor",基于 Javascript,短小精悍,实时在线代码高亮显示,它 ...
2、redis.conf基本配置项说明
Redis的配置项看起来比较复杂,分析之下,其实可以分为几大类(以redis v2.6.14版本的redis.conf为例): 1) 基本配置项 2) 持久化(Pe ...
Nginx的常用配置项
1.几个常见的配置项 $remote_addr与$http_x_forwarded_for 用以记录客户端的ip地址 $remote_user 用来记录客户端用户名称 $time_local 用来记录 ...
ueditor上传图片回调_（常见解决方法）UEditor报错“后端配置项没有正常加载，上传插件不能正常使用”...
(常见解决方法)UEditor报错"后端配置项没有正常加载,上传插件不能正常使用"_向来萧瑟也无畏-CSDN博客blog.csdn.net 报错信息详见此文的"排错过 ...

[转] CodeMirror基本配置项

[转] CodeMirror基本配置项相关推荐

最新文章

热门文章