要素 ui el-table テーブルの垂直および水平スクロール バーは、空白のプレースホルダー列を削除および非表示にします

必要

テーブル コンテンツの列が多すぎる場合は、height属性 でテーブルの高さを設定し、テーブルの高さとテーブル ヘッダーを固定して、テーブル コンテンツをスクロールできるようにすることができます

現在の要求は、右侧滚动条 の見た目が良くないため、除滚动条、并隐藏滚动条所占列

// ----------修改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;
}

効果