element
妖心changeless
前端爬坑之路
展开
-
element el-collapse折叠面板箭头在前显示
【代码】element el-collapse折叠面板箭头在前显示。原创 2023-07-18 10:24:16 · 572 阅读 · 0 评论 -
element input 传递多个值
element-ui中的input的change事件中传递参数。原创 2023-02-27 11:26:27 · 857 阅读 · 0 评论 -
element Upload 上传 图片尺寸校验
// 图片尺寸校验 handleBefore(file){ const isSize = new Promise(function(resolve, reject){ let width = 200; let height = 200; let _URL = window.URL || window.webkitURL; let img = new Image(); img.o...原创 2022-04-13 15:10:38 · 566 阅读 · 0 评论 -
element 表单校验整数
ORDERID: [ { required: false, message: '此项不能为空' }, { pattern: /^([1-9]\d*|[0]{1,1})$/, message: '大于等于0的正整数', }, ],原创 2022-03-28 11:22:28 · 869 阅读 · 0 评论 -
element table 插槽的使用
1:永久2.临时<el-table-column prop="QRCODE_TYPE" label="类型" width="180" align="center" > <template slot-scope="scope"> <span v-if="tableData[scope.$index].QRCODE_TYPE == 1"&.原创 2021-07-22 15:30:10 · 777 阅读 · 0 评论 -
element-ui from表单居中
父元素:text-align: center子元素:display: inline-block<el-row style="text-align: center"> <!-- 一级归属 --> <el-col> <el-form-item label="一级归属" prop="primaryOwnership" s.原创 2021-07-08 18:00:27 · 18113 阅读 · 0 评论 -
element-ui table列设置fixed后做动态表格出现表格错乱
解决前解决后在el-table中添加如下代码:key="index + Math.random()"原创 2021-04-09 11:26:43 · 385 阅读 · 0 评论 -
element 日期控件禁止选择未来日期
HTML <el-form-item label="日期:"> <el-date-picker v-model="queryDate" value-format="yyyyMMdd" type="date" placeholder="选择日期" :picker-options="pickerOptions".原创 2021-03-24 17:02:06 · 950 阅读 · 0 评论 -
element Dialog对话框取消点击外面会关闭
添加属性close-on-click-modal="false"原创 2021-03-24 10:36:55 · 871 阅读 · 0 评论 -
element table 合并列相同数据
table 添加方法:span-method="objectSpanMethod"JS 方法 objectSpanMethod({ row, column, rowIndex, columnIndex }) { if (columnIndex === 4) { const _row = this.spanArr[rowIndex] const _col = _row > 0 ? 1 : 0 return { .原创 2021-03-23 15:25:35 · 506 阅读 · 0 评论 -
element table 条件判断显示不同颜色的文字
table添加方法:cell-style="cellStyle"JS(列从0开始) cellStyle({ row, column, rowIndex, columnIndex }) { debugger if (row.warningTips === '偏高' && columnIndex === 8) { console.log(row.status) return 'color: #fd5757' } .原创 2021-03-23 14:35:00 · 946 阅读 · 0 评论 -
element Transfer 穿梭框 内容太长显示...,鼠标移动上去显示全部
CSS设置宽度和显示点 .el-tree-node__content{ width: 200px; } .el-tree-node__label{ overflow: hidden; word-break: keep-all; white-space: nowrap; text-overflow: ellipsis; }JS 鼠标移动上去显示全部文字组件内添加方法@mouseover.native="addTitle"方法 ad.原创 2021-03-22 10:26:00 · 1582 阅读 · 2 评论 -
element-ui table 表头错位
修改前:修改后:CSS:body .el-table th.gutter{ display: table-cell!important;}原创 2021-03-08 11:02:54 · 150 阅读 · 0 评论 -
vue 动态绑定样式和修改
HTML<el-button class="formButton" @click="switchForm()" v-bind:style="{ color: activeColor,background: activeBackground }">表格</el-button>data activeColor: '#000000', activeBackground: '#ffffff',JS switchForm() { thi..原创 2021-03-05 15:23:50 · 346 阅读 · 2 评论 -
element table内容太长显示... hover的宽度更改
element 控件里写:show-overflow-tooltip="true"CSS.el-tooltip__popper{ max-width:50% }原创 2021-03-01 15:49:37 · 294 阅读 · 0 评论 -
element-ui 使用ref清空input数据
this.$refs.modelPlanRef.reset()modelPlanRef ref的名字ref=“modelPlanRef”原创 2021-03-01 13:43:43 · 1270 阅读 · 0 评论 -
element-ui table操作中按钮的显示
操作中新增最后一个显示其他不显示<span size="mini" style="color: #2a76cd;margin-left: 20px" v-if="scope.$index === tableData.length - 1">新增</span>tableData table定义的内容原创 2021-01-27 10:49:51 · 547 阅读 · 0 评论 -
elemnt-ui table表格线对不齐
在app.vue文件中添加body .el-table th.gutter { display: table-cell !important;}原创 2021-01-13 13:34:18 · 236 阅读 · 0 评论 -
element select内容溢出显示点且不换行
.el-select__tags { flex-wrap: nowrap; overflow: hidden; } .el-select__tags-text{ display:inline-block; max-width:100px; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; } .el-tag .el-icon-cl...原创 2021-01-04 15:48:47 · 608 阅读 · 0 评论 -
element-ui el-input-number 输入框不显示数字,默认清空
<el-input-number v-model="num" @change="handleChange" :min="1" :max="10" label="描述文字"> </el-input-number>data中写num:undefined原创 2020-12-25 17:07:15 · 4023 阅读 · 0 评论 -
element table 无数据时显示图片替换“暂无该数据“
<template slot="empty"> <img src="" alt=""> </template>原创 2020-12-23 13:14:10 · 1189 阅读 · 1 评论 -
element from 表单对齐
<el-form-item label="权重 :label-width=“127px”>原创 2020-12-22 16:55:32 · 1361 阅读 · 0 评论 -
element from 动态验证表单
HTML <el-row ***v-for="(bench, idx) in compIndexInfo.benchList"*** :key="bench.key"> <el-col> <el-form-item v-if="idx === 0" label="采样基准 : " style="margin-left:10px;"> </el-form-item>原创 2020-12-17 10:15:52 · 119 阅读 · 0 评论 -
element checkbox至少有一个被选中
HTML<el-checkbox-group v-model="statItemList" :min="1" :max="2" > <el-checkbox v-for="(city,index) in cities" :key="index+1"原创 2020-12-15 10:29:44 · 1255 阅读 · 0 评论 -
element-ui select input多选内容过多,+1显示
input 添加属性 collapse-tags=“false”原创 2020-12-07 17:06:36 · 2688 阅读 · 2 评论 -
element-ui table动态生成 表头的长度
lable 有两个值若为indexCd width赋值为0若为其他,给一个长度值(如:80)<el-table-column v-for="(item,index) in headerList" :key="index" :prop="item.code" :label="item.name" :width="item.code==='indexCd'?'0':'80'" />原创 2020-12-03 09:41:31 · 442 阅读 · 0 评论 -
element-ui动态创建表头和数据
headerList为数组属性code,name<el-table-column v-for="item in headerList" :key="item" :prop="item.code" :label="item.name" :width="104" />原创 2020-12-02 20:04:06 · 165 阅读 · 0 评论 -
element-ui 分页的实现
HTML <!-- 分页 --> <div class="block"> <div> <span class="rever">第 {{ pageNum }} 页/</span> <span class="padding0">共 {{ pages }} 页</span> </div> <div style=原创 2020-12-02 10:24:57 · 161 阅读 · 0 评论 -
vue element树形图
<div> <el-table :data="tableData1" style="width: 100%;margin-bottom: 20px;" row-key="id" :tree-props="{children: 'children'}" ...原创 2020-09-23 11:10:47 · 612 阅读 · 0 评论 -
去除input type为number的数字增减框
谷歌input::-webkit-outer-spin-button,input::-webkit-inner-spin-button { -webkit-appearance: none; appearance: none; margin: 0;}原创 2020-09-23 11:06:26 · 1229 阅读 · 0 评论 -
element el-select 控件 Invalid prop: type check failed for prop “clearable“.
Invalid prop: type check failed for prop “clearable”. Expected Boolean, got String with value “true”.解决方案:一: : clearable clearable前面加:二: clearable 不写clearable=“true”,...原创 2020-02-20 10:07:24 · 669 阅读 · 0 评论