Element UI

ElementUI表单校验rules封装

2021-10-28 胡振强 48

第一步：在vue的src文件目录下创建utils，在该目录下创建formCheck.js，将下面内容复制到js中//校验规则列表（可扩展）const rules = { //验证不能为空 NOTNULL(str){ return valid(str, null, "不能为空") }, //验证姓名 REALNAME(str){ const regex =/^[\u4e00-\u9fa5_a-zA-Z0-9.·-]+$/ retur...

Element的el-input组件无法输入问题

2021-08-16 胡振强 107

以下为el-input的代码。在被赋值后，输入框组件出现无法输入的问题。<el-input v-model="ruleForm.processReview" class="oms-input" type="textarea" placeholder="请输入处理意见"/>解决方式：增加@input触发事件，即@input="change($event)&q...

切换浏览器窗口 elementui 的tabs组件出现蓝色边框问题

2021-07-15 胡振强 34

解决办法：加入属性覆盖/deep/ .el-tabs__item:focus.is-active.is-focus:not(:active) { box-shadow: none; border-top-left-radius: 20px; border-top-right-radius: 20px; }...

vue中分页数据实现第二页的索引是接着前一个页的索引累加的

2021-06-29 胡振强 38

<el-table-column type="index" :index="indexMethod" :resizable="false" label="序号" width="40"></el-table-column> //分页索引接着上一页的索引 indexMethod(index...

element中el-image如何显示本地图片

2021-06-29 胡振强 40

<el-image style="width: 100px; height: 100px;margin-top: 10px;" :src="require('@/assets/images/logo.png')" :z-index="9999"></el-image>...

elementui循环报错index

2021-06-29 胡振强 38

解决方法：将:index=“item.path”改为:index="item.path + ’ ’ "完美解决原因：elementUI的index是字符串格式，加一个‘ ’，将后台数据转换为字符串<el-menu class="meunbox" :router="true"> <el-submenu :index="index+1+''&quo...

vue与elemnetui项目获取格式化的年月日的实时时间

2021-06-29 胡振强 37

<div class="fl">{{nowDate}}</div>data: function() { return { nowDate: "", // 获取当前时间 } },mounted() { this.currentTime(); },// 销毁定时器 beforeDestroy() { if (this.formatDate) { clearInte...

vue与elementui项目清空表单验证he数据

2021-06-29 胡振强 37

重点：表单的ref prop formrules <el-dialog :title="title" :visible.sync="dialogVisible" width="30%" :before-close="handleClose" center></el-dialog>handleClose() { var vm = this; v...

element-UI级联选择器默认选择是value(也就是id)想要获取label(也就是name值)

2021-06-29 胡振强 37

<el-cascader :options="optionsMessage" clearable filterable :props="defaultProps" @change="changeCity" ref="cascaderAddr" v-model="citySelected"></...

ElementUI select组件下拉选中后同时获取label(name)和value(code)返回给后台

2021-06-29 胡振强 63

<el-form-item label="饺子" prop="zbldid" label-width="70px"> <el-select v-model="form.zbldid" @change="zbldopt" :disabled="$route.query.code == 2" placeholder=&quo...

setInterval设置停止的次数和时间

2021-06-29 胡振强 37

需要知道已经经过了多少次或者说过多久就会停止var timesRun = 0;var interval = setInterval(function(){timesRun += 1;if(timesRun === 60){clearInterval(interval);}//do whatever here..}, 2000);var startTime = new Date().getTime();var interval = setInterval(f...

el-table向上滚动

2021-06-29 胡振强 43

设置table的ref为tablemounted(){// 拿到表格挂载后的真实DOMconst table = this.$refs.table// 拿到表格中承载数据的div元素const divData = table.bodyWrapper// 拿到元素后，对元素进行定时增加距离顶部距离，实现滚动效果(此配置为每100毫秒移动1像素)setInterval(() => {// 元素自增距离顶部1像素divData.scrollTop =div...

elementUI table 隐藏滚动条

2021-06-29 胡振强 35

/deep/.el-table--scrollable-y ::-webkit-scrollbar { display: none;}el-table--scrollable-y 选中滚动条类名替换...

element ui的table出现gutter多一列

2021-06-29 胡振强 71

解决方案：给每一列一个固定的值原因： el-table的宽度是100%,给每一个el-table-column设置宽度之后就会有这个问题解决方法：删除其中一个el-table-column的宽度...

element table表格去掉白边的方式

2021-06-29 胡振强 53

el-table使用:gutter属性时，在表格中会出现border错位，出现白边的现象，解决方式如下：body .el-table th.gutter{ /*解决el-table加了gutter后边框出现白边*/ display: table-cell!important;}...

处理elementui日期选择器获取的时间

2021-06-29 胡振强 42

<el-date-picker v-model="value1" type="daterange" size="small" range-separator="to" @change="getSTime" format="yyyy-MM-dd&qu...

element的dialog与弹框的背景色

2021-06-29 胡振强 72

/* Dialog对话框公共部分样式 Start*/.el-dialog{ background: transparent !important; }.el-dialog__header,.el-message-box__header { height: 44px; background: #FFC337; width: 100%; text-align: center; display: -webkit-box; display: -ms-flexbo...

elementui设置隔行变色

2021-06-29 胡振强 49

.el-table--striped .el-table__body tr.el-table__row--striped.el-table__row--striped.el-table__row--striped td { background-color: #fff; /*替换为你需要的颜色，觉得优先级不够就加!important*/}使用的时候注意table的:stripe=“true” 要写上，不然前缀className匹配不到...

elementUI的表格移入移出加入操作后变色问题

2021-06-29 胡振强 44

左侧与右侧操作页面不一致<el-table-column fixed="right" label="操作"> <template slot-scope="scope"> <el-button @click="handleClick(scope.row)" type="text" size="sma...

element-ui 日期组件最大日期和最小日期限制

2021-06-29 胡振强 52

element-ui 日期组件最大日期和最小日期<el-date-picker v-model="transactionDate" type="daterange" range-separator="至" start-placeholder="开始日期" end-placeholder="结束日期" placeholder="选择日期&quo...

首页 / 脚本样式 / Element UI

ElementUI表单校验rules封装

Element的el-input组件无法输入问题

切换浏览器窗口 elementui 的tabs组件出现蓝色边框问题

vue中分页数据实现第二页的索引是接着前一个页的索引累加的

element中el-image如何显示本地图片

elementui循环报错index

vue与elemnetui项目获取格式化的年月日的实时时间

vue与elementui项目清空表单验证he数据

element-UI级联选择器默认选择是value(也就是id)想要获取label(也就是name值)

ElementUI select组件下拉选中后同时获取label(name)和value(code)返回给后台

setInterval设置停止的次数和时间

el-table向上滚动

elementUI table 隐藏滚动条

element ui的table出现gutter多一列

element table表格去掉白边的方式

处理elementui日期选择器获取的时间

element的dialog与弹框的背景色

elementui设置隔行变色

elementUI的表格移入移出加入操作后变色问题

element-ui 日期组件最大日期和最小日期限制