el-table最后一行固定在底部

最新推荐文章于 2024-05-14 18:01:48 发布

chuxuezhe__1

最新推荐文章于 2024-05-14 18:01:48 发布

阅读量636

点赞数

文章标签： css 前端

本文链接：https://blog.csdn.net/chuxuezhe__1/article/details/131393414

版权

html

<el-table :data="tableDate" :row-class-name="rowClassName">
</el-table>

 rowClass({ row, column, rowIndex, columnIndex }) {
            // console.log(row, column, rowIndex, columnIndex);
            if (row.khxmc == '总分') {
                return 'fixed-row'
            }
},

css

.el-table__body {
        .fixed-row {
            position: sticky;
            bottom: 0;
            width: 100%;
            height: 60px;
            td {
                border: 1px solid #fff;
                box-shadow: 2px -2px 3px 0px #ddd;
            }
        }
   }