
Element-UI
文章平均质量分 52
小湾生产队队长
这个作者很懒,什么都没留下…
展开
专栏收录文章
- 默认排序
- 最新发布
- 最早发布
- 最多阅读
- 最少阅读
-
elementUI中的el-form常用校验规则
elementUI中的el-form常用校验规则:校验使用方式:常用的校验规则:2、限制字符串长度3、只能是正整数4、只能是数字5、数字必须大于18原创 2023-09-11 10:29:38 · 1901 阅读 · 0 评论 -
vue工程中element-ui的tab组件使用ecahrts渲染界面大小异常问题解决(亲测有效)。
vue工程中element-ui的tab组件使用ecahrts渲染界面大小异常,一般就是高度或者宽度不正常。主要原因还是echarts渲染时候,DOM还没渲染好。解决思路:1、获取包装所有tab页面的DIV的宽度和高度,因为这个再tab切换渲染前肯定已经固定存在了。2、给echarts的DOM强制赋值第1步的宽度和高度即可document.getElementById('pidichartDiv').style.height= document.getElementById("tjDi原创 2021-11-29 11:55:37 · 1115 阅读 · 0 评论 -
Element-UI使用篇——el-calendar的使用+样式修改集锦
el-calendar日历组件写在开头:el-calendar日历组件现在git上很很多别人封装好的组件,可以通过npm install 直接安装使用,效果很好,各种事件响应、样式都很炫,对这个要求功能较多的可以百度下使用。功能需求不复杂的,可以用el-calendar组件即可。一、样式修改1、修改整个日历的高度整日历的高度只能修改到日历列表的单元格大小,才能起作用。 .el-calendar-table .el-calendar-day { height: 30.原创 2020-09-03 10:49:50 · 15339 阅读 · 10 评论 -
el-input系列(el-input、el-select等)palceholder 的样式设置
el-input系列所有带有palceholder的,修改palceholder的样式。。。。。为了避免样式污染,对placeholder先包一个父类//谷歌浏览器.父类 /deep/ input :: --webkit-input-placeholder{ color:#FFF}//其他浏览器 ::-moz-placeholder { /* Firefox 19+ */ color: red; } :-ms-input-placeholder { /原创 2020-06-23 18:19:45 · 3624 阅读 · 1 评论 -
el-checkbox的使用与样式修改篇
el-checkbox的使用与样式修改篇一、使用1.1、el-checkbox传值和显示的值不一样使用场景:一般显示的值都是name、或者label,但是传值经常需要传唯一值,比如id解决办法:key绑定传的值,显示的值在两个标签之间单独给设置出来。<el-checkbox-group v-model="checkedCities1" > <el-checkbox v-for="cityin cities" :label="city.id" :key="city..原创 2020-06-22 17:14:42 · 11644 阅读 · 0 评论 -
el-tree的使用与样式修改大全
el-tree的使用与样式修改大全一、样式篇1、修改节点选中后的样式.el-tree-node:focus>.el-tree-node__content{ background-color: #5daaf0; //背景色 color:red; //字体颜色 }二、使用篇...原创 2020-05-29 17:29:20 · 17598 阅读 · 0 评论 -
Element-UI使用篇——el-tab的使用+样式修改集锦
el-tab是tab切换页面一、手动切换tab使用场景:tab1中点按钮,自动切换到tab2中实现:searchBtnHandle(){ this.activeName="tab2的name"; //每个tab有个name属性,可以找到这个tab,activename属性绑 定了当前处...原创 2020-04-06 15:32:54 · 26962 阅读 · 4 评论 -
element-ui样式篇:修改样式不影响全局,不影响其他组件
element-ui每个控件都自带了样式,使用时候很多时候需要修改样式,但是大多数遇到的情况是修改的样式要么不起作用,要么修改了默认样式,导致其他组件用到的地方样式都改了,如何修改样式起作用且不影响其他组件?一、如何找到element样式类名浏览器中F12,找到element组件,找到对应的类名,在浏览器中将需要需改的样式修改好,可以直接看到效果,然后复制到vue文件中。二、vue文件...原创 2019-12-24 16:49:57 · 8283 阅读 · 0 评论 -
Element-UI组件自带方法的使用
Element-UI组件很多自带一些方法,这些方法如何调用:1、组件上添加ref2、使用: this.$refs.tclb.closeDrawer()原创 2019-11-29 11:50:19 · 5265 阅读 · 0 评论 -
vue-cli2项目webpack3 和webpack4环境中:Element-UI在vue项目中,打包build后字体、图标丢失(亲测可解决)
Element-UI在vue项目中,打包build后字体、图标丢失应用场景:F12报错提示:问题原因:(1)查看/build/webpack.base.conf.js文件可以发现,woff或ttf这些字体会经由url-loader处理后在static/fonts目录下生成相应的文件。(2)也就是说实际应该通过/static/fonts/**...原创 2019-11-15 12:53:04 · 2143 阅读 · 1 评论 -
el-table使用与样式修改大全
Element-UI,el-table样式修改大全开篇:修改element的样式的时候style标签不能加上scoped所以为了防止修改的样式影响到别的页面,建议在当前页面加一个id,修改时带上id,或者在样式前面加上 /deep/ ,控制修改的权限范围<template> <div id="top"></div></template...原创 2019-11-14 09:45:48 · 10076 阅读 · 1 评论 -
Element-UI使用与爬坑集合
目录Element-UI使用与爬坑集合一、Element-UI各UI控件属性使用加不加冒号(:)整理二、el-menu组件作为route-view时候,刷新页面后,默认active状态(default-active)与当前路由页面不一致三、el-table实现分页显示四、el-table显示的表格中自己额外添加一列,序号:1,2,3……4.1 添加一列,不管分不分页,都是从...原创 2019-11-07 09:46:22 · 1010 阅读 · 0 评论