Element ui 修改table表格行高

最新推荐文章于 2024-07-15 15:15:49 发布

键盘打烂月入过万

最新推荐文章于 2024-07-15 15:15:49 发布

阅读量3.9k

点赞数 2

文章标签： vue.js elementui 前端

本文链接：https://blog.csdn.net/weixin_67271921/article/details/129436857

版权

 <el-table
        v-loading="dataListLoading"
        :data="dataList"
        style="width: 100%"
        ref="tables"
        class="tab"
        :row-style="iRowStyle"
        :cell-style="iCellStyle"
        :header-row-style="iHeaderRowStyle"
        border
        :header-cell-style="{
          background: 'rgba(194, 210, 255, 0.3)',
          color: '#040415',
        }"
        @selection-change="dataListSelectionChangeHandle"
        :row-key="getRowsKey"
      >

关键代码：

:row-style="iRowStyle"

:cell-style="iCellStyle"

:header-row-style="iHeaderRowStyle"

  computed: {
    iRowStyle: function ({ row, rowIndex }) {
      return 'height:30px';
    },
    iHeaderRowStyle: function ({ row, rowIndex }) {
      return 'height:30px';
    },
    iCellStyle: function ({ row, column, rowIndex, columnIndex }) {
      return 'padding:0px'
    },
  },

效果：