修改目的

使用ElementUI el-tree过程发现选中节点,键盘移动上下键时(key down\key up)el-tree默认高亮移动的节点,业务上需要重写此事件。

​从官网发现该事件没有暴露回调接口,故想到了修改elementui源码,重新打包上传到公司的npm私服。

定位代码

​ 在chrome devtools的Elements选中节点,查看节点的EventListener中keydown事件,可以看到该事件在element-ui.common.js中定义。发现确实是elementui自定义的事件响应,起初有怀疑时浏览器的默认行为类似tab键的功能。

解决问题

ElementUI是开源项目,到github下载项目后修改源码,重新打包上传到私服解决问题。

git clone https://github.com/ElemeFE/element.git # 使用git下载源码
cd element & npm install #安装依赖

在源码的packages/tree/src/tree.vue中找到了对应的代码逻辑。

​我们查看源码后,修改成我们业务上需要的效果,或者直接简单的注释掉这一行代码。在package.json修改公司内部的element-ui版本号。

npm run dist #重新打包
npm publish --registry=http://xxx.xx/xx #发布到公司私服

以上就是本博文的全部内容,如果对你有帮助的话,点赞、评论、转发三连

更多资源与第一手博客,请关注公众号:程序员众推,获取。

记一次ElementUI源码修改过程的更多相关文章

  1. elementUI源码修改定制

    1.修改elementUI源码 首先从Git上克隆代码或者下载代码包 进入文件夹打开终端或Git Bash Here,运行npm install 安装依赖包.npm run dev 打开网页http: ...

  2. el-upload源码修改跳坑

    之前给element-ui提了一个问题,结果没有鸟我,没办法,只能修改源码来满足需求了 (备注:element-ui2依然没有修改,为了迎合产品还是要改源码) 本文讨论的组件属性仅限于list-typ ...

  3. Java学习-039-源码 jar 包的二次开发扩展实例(源码修改)

    最近在使用已有的一些 jar 包时,发现有些 jar 包中的一些方法无法满足自己的一些需求,例如返回固定的格式,字符串处理等等,因而需要对原有 jar 文件中对应的 class 文件进行二次开发扩展, ...

  4. Ubuntu 14.04 LTS 下 android 2.3.5 源码编译过程

    Ubuntu 14.04 LTS 下 android 2.3.5 源码编译过程   在新的Ubuntu 64位系统下去编译早期的安卓源码是会出现很多问题的,因为64位系统在安装完成后,很多32位的兼容 ...

  5. Android6.0 源码修改之屏蔽系统短信功能和来电功能

    一.屏蔽系统短信功能 1.屏蔽所有短信 android 4.2 短信发送流程分析可参考这篇 戳这 源码位置 vendor\mediatek\proprietary\packages\apps\Mms\ ...

  6. openfire源码修改后如何打包部署到linux服务器上

    原文:http://blog.csdn.net/jinzhencs/article/details/50457152 1.linux版本的3.10.3解压部署启动(过程略,参考我的另一篇博文http: ...

  7. vue打包时,assets目录 和static目录下文件的处理区别(nodeModule中插件源码修改后,打包后的文件应放在static目录)

    为了回答这个问题,我们首先需要了解Webpack如何处理静态资产.在 *.vue 组件中,所有模板和CSS都会被 vue-html-loader 及 css-loader 解析,并查找资源URL.例如 ...

  8. 05.ElementUI源码学习:项目发布配置(github pages&npm package)

    0x00.前言 书接上文.项目第一个组件已经封装好,说明文档也已编写好.下面需要将说明文档发布到外网上,以此来展示和推广项目,使用 Github Pages功能实现.同时将组件发布之 npm 上,方便 ...

  9. python的paramiko源码修改了一下,写了个操作命令的日志审计 bug修改

    python的paramiko源码修改了一下,写了个操作命令的日志审计,但是记录的日志中也将backspace删除键记录成^H这个了,于是改了一下代码,用字符串的特性. 字符串具有列表的特性 > ...

随机推荐

  1. 【趣味设计模式系列】之【代理模式4--ASM框架解析】

    1. 简介 ASM是assemble英文的简称,中文名为汇编,官方地址https://asm.ow2.io/,下面是官方的一段英文简介: ASM is an all purpose Java byte ...

  2. The Triangle (简单动态规划)

    7 3 8 8 1 0 2 7 4 4 4 5 2 6 5 (Figure 1) Figure 1 shows a number triangle. Write a program that calc ...

  3. [BUUOJ记录] [HCTF 2018]WarmUp

    BUUOJ Web的第一题,其实是很有质量的一道题,但是不知道为什么成了Solved最多的题目,也被师傅们笑称是“劝退题”,这道题的原型应该是来自于phpMyadmin的一个文件包含漏洞(CVE-20 ...

  4. Java中的String字符串及其常用方法

    字符串(String) 文章目录 字符串(String) 直接定义字符串 常用方法 字符串长度 toLowerCase() & toUpperCase()方法 trim()方法去除空格 判空 ...

  5. 测试JsonAnalyzer2的12个测试用例:

    测试用例如下: 01. Compact json text={"status":"","message":"success&quo ...

  6. SpringBoot搭建环境

    选择文件新建一个项目 选择:Spring Initializr,其他配置不变,点击下一步 这里一般写包名和项目名,这里我就默认,直接点击下一步 这里选择:Web  --> Spring Web ...

  7. ui自动化---WebDriverApi接口

    一.webdriver client原理 当测试脚本启动Chrome的时候,selenium-webdriver 会首先在新线程中启动Chrome浏览器.启动后selenium-webdriver会将 ...

  8. java输出1-100之间的数并求和for+while+do while实现

    public static void main(String args[]) {//do while int sum = 0; //当前之和 int i = 1; //加数 do { if (i%2= ...

  9. postman -- 环境变量、全局变量使用

    背景: [登录接口]中会返回sign值,[学生金币充值接口]会则需要用到该sign值,因此把sign设置为环境或全局变量,便于其他接口调用. 1.请求登录接口,获取sign值: 2.把sign值添加至 ...

  10. json模块:json.dumps()、json.loads()、json.dump()、json.load()

    json.dumps().json.loads().json.dump().json.load() 4个方法的总结和使用: 注意:存在文件里面的东西,读出来都是字符串 import json 1.js ...