前言最近在处理element-ui表单的时候,需要在表单中实现多列表头高亮排序。查了下官网,发现目前没有相关配置。我只能手动配置修改大概的效果。看了下文档介绍如下,发现这个效果可以通过结合h??eader-cell-style和sortChange来实现。代码实现="el-icon-loading"element-loading-background="rgba(0,0,0,0.2)"@sort-change="sortChange":stripe="stripe"@row-dblclick="rowDblclick":header-cell-style="handleTheadStyle">exportdefault{data(){return{activeThead:{}//保存选中的header};},props:{mutilSort:{default:true},}methods:{sortChange(obj){this.$emit("sort-change",obj);/***不按多列排序,不往下执行*/if(!this.mutil排序)返回;if(obj.order){this.activeThead[obj.prop]=obj.order;}elseif(!obj.order){this.activeThead[obj.prop]="";}}},/***设置表头排序*/handleTheadStyle({row,column,rowIndex,columnIndex}){/***不进行多列排序,不向下执行*/if(!this.mutilSort)return;if(this.activeThead[column.property]){column.order=this.activeThead[column.property];}}
