下载vue2-brace-editor源代码,先执行npm install安装项目依赖

在ace.component.vue组件的methods添加setCustomPrompts方法

修改完源码后,执行npm run build,生成dist目录下的vue-ace.min.js压缩文件

在自己的项目中引入vue-ace.min.js,放在static目录下(static中的文件,打包时会自动加入最终的打包目录)

在自己项目的aceEditor组件中,通过handleSetCompleteData调用setCustomPrompts

handleSetCompleteData(data){
this.$refs['MyAceEditor'].setCustomPrompts(data);
},

最后在业务代码中,传入需要自定义提示的代码数据, 通过调用handleSetCompleteData传入

// let completeData = [
// {meta: '表名', caption: 'table1', value: 'table1', score: 5},
// {meta: '表名', caption: 'table2', value: 'table2', score: 5},
// {meta: '表名', caption: 'table3', value: 'table3', score: 5},
// {meta: '库名', caption: 'moni_general1', value: 'moni_general1', score: 5},
// {meta: '库名', caption: 'moni_general2', value: 'moni_general2', score: 5},
// {meta: '库名', caption: 'moni_genera3', value: 'moni_genera3', score: 5},
// ]
// this.$refs['aceEditor'].handleSetCompleteData(completeData)

vue2-brace-editor代码编辑器添加自定义代码提示(修改源码)的更多相关文章

  1. 前端代码编辑器ace 语法提示 代码提示

    本文主要是介绍ace编辑器的语法提示,自动完成.其实没什么可特别介绍的,有始有终吧,把项目中使用到的ace的功能都介绍下. { enableBasicAutocompletion: false, // ...

  2. 【代码管理】GitHub超详细图文攻略 - Git客户端下载安装 GitHub提交修改源码工作流程 Git分支 标签 过滤 Git版本工作流

    GitHub操作总结 : 总结看不明白就看下面的详细讲解. . 作者 :万境绝尘  转载请注明出处 : http://blog.csdn.net/shulianghan/article/details ...

  3. easyUI整合富文本编辑器KindEditor详细教程(附源码)

    原因 在今年4月份的时候写过一篇关于easyui整合UEditor的文章Spring+SpringMVC+MyBatis+easyUI整合优化篇(六)easyUI与富文本编辑器UEditor整合,从那 ...

  4. 使用百度UMeditor富文本编辑器,修改自定义图片上传,修改源码

    富文本编辑器,不多说了,这个大家应该都用到过,至于用到的什么版本,那就分很多种 CKEditor:很早以前叫FCK,那个时候也用过,现在改名了,比较流行的一个插件,国外很多公司在用 UEDITOR:百 ...

  5. ACE代码编辑器,代码提示,添加自定义数据

    //设置自动提示代码 var setCompleteData = function(data) { var langTools = ace.require("ace/ext/language ...

  6. 【示例代码】HTML+JS 画图板源码分享

    一个有趣的画图板, 用了 HTML5中的本地存储.下载.canvas 等技术,这个项目中用到了canvas 的很多基础功能,初学者可以学习一下 . 建议开发童鞋使用统一开发环境UDE来进行查看.调试. ...

  7. IDEA定位到类的代码区域(查看类的源码)

    经常需要查看某一个类中的成员变量和方法,那么怎么进入到这个类的源码区域呢?在IDEA中只需要使用快捷键: ctrl+shift+t 就可以快速定位到这个类的源码.

  8. 吾日三省吾身 java核心代码 高并发集群 spring源码&思想

    阿里面试题    未解决https://my.oschina.net/wuweixiang/blog/1863322 java基础  有答案  https://www.cnblogs.com/xdp- ...

  9. Linux内核驱动学习(二)添加自定义菜单到内核源码menuconfig

    文章目录 目标 drivers/Kconfig demo下的Kconfig 和 Makefile Kconfig Makefile demo_gpio.c 目标 Kernel:Linux 4.4 我编 ...

随机推荐

  1. 【Share Code | Javascript & HTML & CSS】链接悬停显示图像效果

    demo & 代码 链接悬停效果,显示缩略图. 今天给大家分享一组链接悬停效果.悬停链接时显示具有特定效果的缩略图. 这是一些效果: 参考 Image Reveal Hover Effects

  2. 将 vue 的项目放在 手机上查看 及 测试 bug

    首先:我们应该让电脑和手机 处在同一个局域网下面,最简单的方法,就是让手机链接电脑的 WiFi ,或者让电脑链接手机的 WiFi ,然后得到我们的 ip 地址 在电脑上获取 ip 地址就行 获取方法: ...

  3. wls12C启用Gzip

    https://community.oracle.com/message/14109820 https://docs.oracle.com/middleware/1221/wls/NOTES/what ...

  4. [Java]使用正则表达式实现分词

    手工分词稍嫌麻烦,不好维护,而利用正则表达式就利索多了.Java提供了java.util.regex.Matcher,java.util.regex.Pattern类来帮助我们实现此功能. 例一:以下 ...

  5. python threading.current_thread().name和.getName()有什么区别

    今天学到python多线程这块,想显示当前线程是主线程还是子线程.网上一搜,有个方法叫 threading.current().name 定海偶然 但是发现,同样的threading.current_ ...

  6. Reactjs之Axios、fetch-jsonp获取后台数据

    1.新增知识点 /** Axios获取服务器数据(无法跨域,只能让后台跨域获取数据) react获取服务器APi接口的数据: react中没有提供专门的请求数据的模块.但是我们可以使用任何第三方请求数 ...

  7. rocketMQ 订阅关系

    场景:2 个消费者进程中,创建了 2 个消费者,同属于 1 个消费组,但是订阅了不同的 topic,会因为订阅信息相互覆盖,导致拉不到消息. 原因是 rocketMQ 的订阅关系,是根据 group ...

  8. 阶段3 2.Spring_04.Spring的常用注解_4 由Component衍生的注解

    为什么要使用者三个注解 Controller:表现层 Service:业务层 Repository:持久层 在这里就是用Controller 运行也没问题 用Service Repository同样也 ...

  9. c++面向对象 —— 类和对象

    类和对象 类用于指定对象的形式,它包含了数据表示法和用于处理数据的方法.类中的数据和方法称为类的成员.函数在一个类中被称为类的成员. 一.类定义 实际上并没有定义任何数据,但它定义了类的名称意味着什么 ...

  10. 《Google工作法》读书笔记

    最近一段时间,拜读了<Google工作法>,工作效率提升10倍的57个技巧. 作者是彼得·费利克斯·格日瓦奇,波兰人. 其中印象最深刻的部分如下: (1)不要被邮件夺走时间 不用邮件,所有 ...