need
When there are too many table content columns, you can set the table height throughheight属性 to fix the table height and table header so that the table content can be scrolled
The current demand is that右侧滚动条 does not look good, and we need to go to the location of 除滚动条, 并隐藏滚动条所占列
// ----------修改elementui表格的默认样式-----------
.el-table__body-wrapper {
&::-webkit-scrollbar {
// 整个滚动条
width: 0; // 纵向滚动条的宽度
background: rgba(213,215,220,0.3);
border: none;
}
&::-webkit-scrollbar-track {
// 滚动条轨道
border: none;
}
}
// --------------------隐藏table gutter列和内容区右侧的空白
.el-table th.gutter{
display: none;
width:0
}
.el-table colgroup col[name='gutter']{
display: none;
width: 0;
}
.el-table__body{
width: 100% !important;
}
Effect
