elementui-Table-设置fixed,表格横向滚动条无法滚动

el-table-column 设置fixed属性,表格横向滚动条无法滚动

问题描述

图中设置fixed部分，无法滚动

展示代码

<el-table class="has-fixed-table" ref="table" v-loading="tableLoading" :data="tableData" border
    highlight-current-row @selection-change="tableSelectionChangeHandle" show-summary
    :summary-method="getSummaries">
    <el-table-column prop="code" key="code" label="订单号" align="center"
         :resizable="false" fixed="left">
        <template slot-scope="scope">
            <span class="blue-color" style="cursor: pointer;">{{scope.row.code}}</span>
        </template>
    </el-table-column>
    <el-table-column label="操作" width="240px" fixed="right" align="center"
        class-name="table-btn-text">
        <template slot-scope="scope">           
        </template>
    </el-table-column>
</el-table>

解决方法

// 解决x滚动条无法滚动
.has-fixed-table.el-table--scrollable-x {
  // 方式1
  .el-table__body-wrapper {
    z-index: 1;
  }
  // 方式2
  //   .el-table__fixed-right {
  //     height: auto !important;
  //     bottom: 17px;
  //   }
  //   .el-table__fixed {
  //     height: auto !important;
  //     bottom: 17px;
  //   }
}