element-ui 2.x el-table去掉縱向滾動條並隱藏空白占位列

當table內容列過多時，可通過height屬性設置table高度以固定table高度、固定表頭，使table內容可以滾動

現在需求是右側滾動條不好看，需要去除滾動條，並隱藏滾動條所占列的位置

// ----------修改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列和內容區右側的空白 start
.el-table th.gutter{
  display: none;
  width:0
}
.el-table colgroup col[name='gutter']{
  display: none;
  width: 0;
}

.el-table__body{
  width: 100% !important;
}

// --------------------隱藏table gutter列和內容區右側的空白 end

效果：

搞定