Element UI+Vue开发中遇到的一些问题

1、表头时间排序（根据传参后端返回）

在el-table标签输入@sort-change=“handleCommand”

handleCommand(column) {
    let sortingType = column.order
    if(sortingType == "ascending") {
        this.$set(this.query, 'sort', 'asc')//传参
        this.getData()//重新获取数据
    }else {
        this.$set(this.query, 'sort', 'desc')//传参
        this.getData()//重新获取数据
    }
},

2、超出文本显示省略号，鼠标悬浮显示全部
超出文本显示省略号

overflow: hidden;
text-overflow:ellipsis;
white-space: nowrap;

鼠标悬浮显示全部

el-table-column中添加show-overflow-tooltip

修改显示框的样式

.el-tooltip__popper {
    width: 50%;/*修改宽度*/
    background: #000 !important;/*背景色  !important优先级*/
    opacity: 0.8 !important;/*背景色透明度*/
    color: #FFFFFF !important;/*字体颜色*/
    font-size: 14px!important;
    line-height: 18px;
}

3、动态修改表头class，未能及时更新

添加slot-scope="scope"

4、选中行高亮显示

el-table添加highlight-current-row

点击行选中事件

el-table添加@row-click=“showHistory”

 showHistory(row,column,event) {
     console.log(row.id)
     this.getDetailHistory(row.id)//掉后台接口传参
 },