1、el-table一直闪烁,具体方法和百度上一样
.el-table {
width: 99.9% !important;
}
.el-table__body {
width: 100% !important;
}
2、左固定列在滚动轮缩放的时候出现的错位
在网上找了几种方案 发现都没用
像这种 重绘也没用
this.$refs.multipleTable.doLayout()
后面我发现 当有x滚动条时不会出现错位,于是通过js监听滚动来设置是否给对应列加fixed属性
mounted () {
/* 注册事件 */
if(document.addEventListener) {
document.addEventListener('DOMMouseScroll', this.scrollFunc, false);
} // W3C
window.onmousewheel=document.onmousewheel = this.scrollFunc; // IE/Opera/Chrome/Safari
window.onresize = () => {
this.scrollFunc();
};
},
// 滚动轮监听事件
scrollFunc () {
setTimeout(() => {
this.tabelHasScroll();
});
},
// 判断是否表格有滚动条
tabelHasScroll () {
let tableDom = document.getElementsByClassName('purchase-details')[0];
let tbodyDom = tableDom.getElementsByClassName('el-table__body')[0];
if (tbodyDom.offsetWidth > tableDom.offsetWidth) {
this.hasXscroll = true;
} else {
this.hasXscroll = false;
}
tableDom = null;
tbodyDom = null;
},
beforeDestroy () {
document.removeEventListener('DOMMouseScroll');
window.onmousewheel=document.onmousewheel = null;
}