el-talbe
AlexKain
不相信天分,只相信汗水
展开
-
[vue][element-ui][el-table]控制表格的滚动条滑动到最右边
场景复现表格宽度过长产生了横向的滚动条,实行当前页的编辑时会触发表格的数据重新渲染,重新渲染时,会降滚动条拉到最左边,这就就要在列表动态渲染完之后,将滚动条拉回最右边方法refs[‘tableList’]上有一个bodyWrapper里面有scrollLeft 属性,可以设置表格左滑动的距离为整个表格的宽度,而表格的宽度在refs[‘tableList’].bodyWidth,替换字符串和变数字以后就可以了JS部分this.$nextTick(()=>{ this.$refs.table原创 2021-03-10 09:28:39 · 3709 阅读 · 4 评论 -
如何在el-table中传递index到el-checkbox
表格的多选传递scope.$index的传递方式<el-checkbox v-model="scope.row.show" :true-label="1" :false-label="0" @change="handleCheckItemChange(scope.row.show,scope.$index)"></el-checkbox>js部分// 行级按钮事件handleCheckItemChange (val, i) { console.log(val, i)}原创 2020-09-07 16:53:01 · 1220 阅读 · 0 评论 -
elementUI的表格标题换行
表头换行显示 <el-table :data="list" class="table-border text-noellipsis"> <el-table-column prop="rptDate" label="日期" :formatter="formatDate"></el-table-column> &am原创 2018-11-27 10:05:35 · 5301 阅读 · 0 评论 -
eltble设置能和背景相连的(sao)操作
先放效果图:如图所示:当激活了当前行,就和背景(也就是左边),看上去连接在一起思路1.未hover或click激活的最后一个td,样色都是设置同一个颜色2.hover时和click激活时,再设置对应的颜色3.其实最右边的那一列td是固定住的<el-table :data="list" highlight-current-row @current-change="handleC...原创 2018-12-07 17:08:50 · 182 阅读 · 0 评论 -
每日三思:element-ui利用form表单验证来验证表格
动态验证表格里的输入框效果图<el-form :model="form" :rules="rules" ref="form"> <el-table class="form-brand-list" stripe v-if="form.prdctStoreList && form.prdctStoreList.length > 0" :data="fo...原创 2019-06-19 18:18:56 · 437 阅读 · 0 评论 -
[element-ui]el-table中设置类似标签的样式
效果图思路与分析可以直接使用定位做给对应的单元格添加相应的class类不能使用图片做,要使用背景和css3的伪类(画白色的三角)注意事项自身容器高度的限定及宽度的限定,自身padding-bottom的设定,避免字过长时压住白色三角,白色三角的高度不能过长,效果图上是0.05rem;且border宽是父级容器宽的一半,底部的border高度是border宽的一半父级...原创 2019-09-05 17:03:40 · 2076 阅读 · 0 评论