el-table的自定义行高设置

发生场景:

el-table默认的行高与padding,使原本在一页中不能完全呈现内容,所以需要自定义行高;单独的设置height会达到最小值,但还是和要求不符,所以修改了padding值,让默认的内边距减小,使内容更紧贴;

具体操作:

在el-table标签上,设置 :row-style=“{height: ‘0’}” 为最小行高,同时修改默认的padding值;让表格更好的展示为一页;

关键代码:

<el-table
    :data="tableData"
    border
    style="width: 100%"
    :row-style="{height: '0'}"
    :cell-style="{padding: '3px'}"
    :header-cell-style="{ background: '#eef1f6', color: '#606266' }"
    >
el-table>

你可能感兴趣的:(vue,vue.js,javascript,前端)