vxe-自定义排序图标与更改分辨率表格列内容正常显示

1.实现目的

（1）更改表格图标排序交互效果，上下箭头形式无法实现点击整体模块实现排序的实现。

（2）vxe表格通过属性设置放大缩小更改分辨率后，表格列字段出现滚动条，现在需求是更改分辨率后表格列字段内容完全显示，且初始100%时表格列展示完全。

2.现有效果

排序为上下箭头形式，且可实现左侧拉伸单元列宽。放大缩小后出现省略号。

3.主体代码参考

3.1更改排序图标

vxe-table表格属性更改

表头列字段设置

 css样式修改。

// 表头排序样式
.my-sort .custom-sort {
    padding: 0 4px;
}
.my-sort .custom-sort.is-order {
    color: #409eff;
}

3.2分辨率显示完全

html结构,设置每一列最小宽度，所有最小宽度相加等于表格所占宽度。

css强制表格列内容显示在一行内，不换行。

/deep/.vxe-table--render-default .vxe-cell{
    white-space: nowrap !important;
    padding-left: 5px !important;
    padding-right: 0 !important;
}

4.实现效果