element-ui的那些坑与总结
tags:

默认情况下,下划线是文本宽度
如果要加宽,则可以设置文本(label)的padding, 常规情况下,无法改label宽度,因为他是动态计算的
不过,可以通过自定义,把label拿出来,自己控制,设置span的padding值即可增加下划线的宽度
ps: 在span上添加class是无效的,所以需要通过他的父级,然后通过/deep/的方式,覆盖修改span的style

upload:
如果要自定义上传图片的展示效果,需要两步:
- show-file-list: false; 这个属性会不展示上传的图片列表
- 自己添加div标签,根据个人口味(style)和布局来展示图片列表,这样的好处,还有图片的一些操作,比如删除,预览的位置,图标都可以自定义
- ps: 目前不支持编辑图片
- 在表单中引入el-upload,验证的时候要调用
this.$refs['form'].clearValidate(prop) 不然的话,错误信息会一直在,prop为字段名
form:
- 提交的时候,滚动到第一个错误信息处:
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的那些坑与总结的更多相关文章
- [坑况]饿了么你是这样的前端——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/ ...
- vue与element ui的el-checkbox的坑
一,场景 通过使用checkbox,实现如图的场景, 点击某个tag,实现选中和非选中状态. 二, 官网的例子 通过切换checked值为true或者false来实现,一个checkbox的状态切换 ...
- element UI排坑记(一):判断tabs组件是否切换
之所以将这个问题列在排坑记之中,是因为官方组件的一个属性颇有些隐蔽,这个问题曾经折腾了本人较多时间,始终思维固着,且使用搜索引擎也不容易搜索到答案,故记之.然而实际解决却是相当简单的. 一.问题描述 ...
- element UI 饿了么 UI 分页 按钮不显示的问题
https://blog.csdn.net/sinat_37255207/article/details/88914235 一个很坑的 深坑 element UI 的 按钮 不显示的深坑 <e ...
- element ui form表单清空规则
公司项目重构,经过商定使用element ui.在重构项目的时候发现一下element ui上很蛋疼的东西. 例如,这个form表单就是一个.趁着在高铁上没事,把想写的东西写一下. 先说一下eleme ...
- element ui实现手动上传文件,且只能上传单个文件,并能覆盖上传。
element ui提供了成熟的组件场景,但实际工作中难免会遇到认(sha)真(diao)的产品.比如,最近遇到的,要求实现手动上传特定格式文件(用户点击“上传文件”按钮,确定之后,只是单纯选择了文件 ...
- element ui 中的 resetFields() 报错'resetFields' of undefined
每次做各种form表单时,首先要注意的是初始化,但是刚开始若没有仔细看文档,则会自己写个方法将数据设置为空,但是这样就会出现一个问题,表单内存在各种验证,假如是一个弹框内有form表单,弹框出现就执行 ...
- 关于vue.js element ui 表单验证 this.$refs[formName].validate()的问题
方法使用前需了解: 来自”和“小编的小提示: 首先打印一下this.$refs[formName],检查是否拿到了正确的需要验证的form. 其次在拿到了正确的form后,检查该form上添加 ...
- element ui设置表格表头高度和每一行的高度
填坑记录:今天用element ui的表格组件做用户信息展示,直接拉取的官网的代码过来,发现表头和每一行都太高了,如下: 因为第一次使用element ui的表格组件,不太清楚会遇到这样的坑,以为能轻 ...
- element ui 停止维护了
️♂️ element ui 停止维护了 最近看到有人说 element ui 已经停止维护了,还有点不相信; 不过到 github 验证一下,好像是真的呀 4 个月,没有任何更新了 https:/ ...
随机推荐
- android开发_文本按钮 与 输入框
1 TextView: 属性与值 android:text="文本" android:textSize="20sp" //sp为 ...
- eclipse改jsp文件编码格式 统一设置
- 单元测试系列之九:Sonar 常用代码规则整理(一)
更多原创测试技术文章同步更新到微信公众号 :三国测,敬请扫码关注个人的微信号,感谢! 摘要:公司部署了一套sonar,经过一段时间运行,发现有一些问题出现频率很高,因此有必要将这些问题进行整理总结和分 ...
- Summary on deep learning framework --- PyTorch
Summary on deep learning framework --- PyTorch Updated on 2018-07-22 21:25:42 import osos.environ[ ...
- linux 查看命令总结
1.tail -f -n 200 cat.log 2.使用less命令 less all.2018092510.0.log 打开log文件,默认显示100行记录. 输入/CustGroupListSe ...
- Linux 文件内容查看(cat、tac、nl 、more 、less、head、tail )
Linux系统中使用以下命令来查看文件的内容: cat: 由第一行开始显示文件内容tac :从最后一行开始显示,可以看出 tac 是 cat 的倒著写!nl: 显示的时候,顺道输出行号!more ...
- web 页面间传值 js 封装方法
用法 var id = getParam("id"); function getParam(strKey) { var url=document.URL; //var url=&q ...
- StringBuffer的delete方法与deleteCharAt方法的区别。
delete方法与deleteCharAt两个方法都是用来删除StringBuffer字符串指定索引字符的方法, delete(int begin,int end)有两个参数,使用时删除索引从be ...
- Pandas 基础(16) - Holidays
这节依然是关于时间方面的知识.上一节学习了如何获取日期序列的函数, 以及通过一些基本的参数设置可以使时间序列跳过休息日等.这一节, 将要深入学习这个点, 做更自定义的设计. 通过上一节的学习, 我们知 ...
- Java NIO 系列学习(一)Java NIO概述
参考资料: http://www.importnew.com/19816.html http://ifeve.com/overview/ NIO 三大核心部分: Channel(通道).Buffer( ...