tags:

默认情况下,下划线是文本宽度

如果要加宽,则可以设置文本(label)的padding, 常规情况下,无法改label宽度,因为他是动态计算的

不过,可以通过自定义,把label拿出来,自己控制,设置span的padding值即可增加下划线的宽度

ps: 在span上添加class是无效的,所以需要通过他的父级,然后通过/deep/的方式,覆盖修改span的style

upload: 

  如果要自定义上传图片的展示效果,需要两步:

  1. show-file-list: false; 这个属性会不展示上传的图片列表
  2. 自己添加div标签,根据个人口味(style)和布局来展示图片列表,这样的好处,还有图片的一些操作,比如删除,预览的位置,图标都可以自定义
  3. ps: 目前不支持编辑图片
  4. 在表单中引入el-upload,验证的时候要调用
    this.$refs['form'].clearValidate(prop) 不然的话,错误信息会一直在,prop为字段名

form:

  1. 提交的时候,滚动到第一个错误信息处:

    this.$refs['form'].validate(valid => {
    if (valid) {
    // to do
    } else {
      setTimeout(() => {
      const isError = document.querySelector('.is-error');
      const input = isError.querySelector('input')
      input.focus();
    }, 1000)
    return false;
    }

element-ui的那些坑与总结的更多相关文章

  1. [坑况]饿了么你是这样的前端——vue+element ui 【this dependency was not found:'element-ui/lib/theme-chalk/index.css'】

    element ui 坑况:今日pull代码,潇洒npm run dev ,被告知:this dependency was not found:'element-ui/lib/theme-chalk/ ...

  2. vue与element ui的el-checkbox的坑

    一,场景 通过使用checkbox,实现如图的场景, 点击某个tag,实现选中和非选中状态. 二, 官网的例子 通过切换checked值为true或者false来实现,一个checkbox的状态切换 ...

  3. element UI排坑记(一):判断tabs组件是否切换

    之所以将这个问题列在排坑记之中,是因为官方组件的一个属性颇有些隐蔽,这个问题曾经折腾了本人较多时间,始终思维固着,且使用搜索引擎也不容易搜索到答案,故记之.然而实际解决却是相当简单的. 一.问题描述 ...

  4. element UI 饿了么 UI 分页 按钮不显示的问题

    https://blog.csdn.net/sinat_37255207/article/details/88914235 一个很坑的 深坑  element UI 的 按钮 不显示的深坑 <e ...

  5. element ui form表单清空规则

    公司项目重构,经过商定使用element ui.在重构项目的时候发现一下element ui上很蛋疼的东西. 例如,这个form表单就是一个.趁着在高铁上没事,把想写的东西写一下. 先说一下eleme ...

  6. element ui实现手动上传文件,且只能上传单个文件,并能覆盖上传。

    element ui提供了成熟的组件场景,但实际工作中难免会遇到认(sha)真(diao)的产品.比如,最近遇到的,要求实现手动上传特定格式文件(用户点击“上传文件”按钮,确定之后,只是单纯选择了文件 ...

  7. element ui 中的 resetFields() 报错'resetFields' of undefined

    每次做各种form表单时,首先要注意的是初始化,但是刚开始若没有仔细看文档,则会自己写个方法将数据设置为空,但是这样就会出现一个问题,表单内存在各种验证,假如是一个弹框内有form表单,弹框出现就执行 ...

  8. 关于vue.js element ui 表单验证 this.$refs[formName].validate()的问题

        方法使用前需了解: 来自”和“小编的小提示: 首先打印一下this.$refs[formName],检查是否拿到了正确的需要验证的form. 其次在拿到了正确的form后,检查该form上添加 ...

  9. element ui设置表格表头高度和每一行的高度

    填坑记录:今天用element ui的表格组件做用户信息展示,直接拉取的官网的代码过来,发现表头和每一行都太高了,如下: 因为第一次使用element ui的表格组件,不太清楚会遇到这样的坑,以为能轻 ...

  10. element ui 停止维护了

    ️‍♂️ element ui 停止维护了 最近看到有人说 element ui 已经停止维护了,还有点不相信; 不过到 github 验证一下,好像是真的呀 4 个月,没有任何更新了 https:/ ...

随机推荐

  1. 湘潭邀请赛+蓝桥国赛总结暨ACM退役总结

    湘潭邀请赛已经过去三个星期,蓝桥也在上个星期结束,今天也是时候写一下总结了,这应该也是我的退役总结了~ --------------------------------湘潭邀请赛----------- ...

  2. Oracle 12c 单实例安装

    准备工作 实验环境:Redhat 6.6   Oracle 12c 12.2.0.1 1.官网下载 https://www.oracle.com/technetwork/database/enterp ...

  3. Flask Web框架

    Flask依赖两个外部库:Werkzeug和Jinja2.Werkzeug是一个WSGI(在Web应用和多种服务器之间的标准Python接口)工具集:Jinja2负责渲染模板.所以在安装Flask之前 ...

  4. 工作中常用的 Shell 命令及技巧

    调试 bash 脚本的技巧 加 -x 参数运行 bash 脚本时,会显示执行的语句 # 也可以在 demo.sh 中加上 set -x bash -x demo.sh 设置环境变量,然后通过如上方式运 ...

  5. 编译openwrt时报错:g++: internal compiler error: Killed (program cc1plus)

    答: 这是内存不足导致的,增大内存或者减少运行的线程即可

  6. unittest用例执行的顺序

    unittest在执行用例(test_xxx)时,并不是按从上到下的顺序执行,有特定的顺序. 示例: import unittest class TestBdd(unittest.TestCase): ...

  7. C++学习建议

    C++学习建议 C++缺点之一,是相对许多语言复杂,而且难学难精.许多人说学习C语言只需一本K&R<C程序设计语言>即可,但C++书籍却是多不胜数.我是从C进入C++,皆是靠阅读自 ...

  8. 用Python实现支持向量机并处理Iris数据集

    SVM全称是Support Vector Machine,即支持向量机,是一种监督式学习算法.它主要应用于分类问题,通过改进代码也可以用作回归.所谓支持向量就是距离分隔面最近的向量.支持向量机就是要确 ...

  9. Confluence 6 升级以后

    7. 拷贝你的数据库驱动 如果你现在使用的是 Oracle 或者 MySQL 数据库的话,你讲要重新拷贝 jdbc 驱动的 jar 文件到你已经存在的 Confluence 安装目录中 conflue ...

  10. 『Python进阶』专题汇总

    基础知识 Python3内置函数 『Python』库安装 『流畅的Python』第1~4章_数据结构.编码 『Python』基础数据结构常见使用方法 『Python CoolBook』数据结构和算法_ ...