使用 “黑魔法” 优雅的修改第三方依赖包

摘要

Vue项目中使用的element-ui,由于弹窗里表单项太多,一些表单项会在可视范围之外。校验表单时,如果未通过校验的表单项在可视范围外,用户感知不强。所以需要在表单校验未通过时滚动到第一个未通过校验的表单项那里,翻看element-ui文档,发现未提供该API。

起初想到的方案有两种:

  1. 在业务中封装函数,表单校验失败时调用该函数,根据表单校验失败的className,获取第一个校验失败的dom元素,滚动到指定的dom元素位置。但是如果页面存在多个form表单需要做区分,会增加我们的一个工作量,并且不够优雅。
  2. 修改element-ui的源码,增加一个API。但是在平台编译时如果重新执行npm install时代码会被覆盖,并且团队协作时也会遇到这个问题,团队开发中有诸多不便。

后面经过一顿搜索后,发现一个“黑魔法”的解决方案。并且该方案上手简单、便携、且一劳永逸。

欢迎在评论区写下你对这篇文章的看法。

评论

首页 - Wiki
Copyright © 2011-2025 iteam. Current version is 2.144.0. UTC+08:00, 2025-07-11 14:37
浙ICP备14020137号-1 $访客地图$