el-table-column 列宽如何百分比设置

冰凉洋柿子

于 2024-08-28 15:45:57 发布

阅读量462

点赞数 4

文章标签：前端 vue

本文链接：https://blog.csdn.net/bobo_tea/article/details/141642044

版权

element-ui设置table组件宽度为百分比

<el-table-column align="center" label="名称" prop="code" width="10%"/>

这么做设置的列宽是无效的

 <el-table v-loading="loading" :data="list" :reserve-selection="true" @selection-change="handleSelectionChange"
      size="small" style="width: 100%;">
      <el-table-column type="selection" width="55" />
      <el-table-column align="center" label="编码" prop="code" min-width="10%"/>
      <el-table-column align="center" label="名称" prop="name" min-width="25%"/>
      <el-table-column align="center" label="状态" prop="status" min-width="15%">
    </el-table>

使用min-width属性设置百分比实现

每一个el-table-column都需要使用min-width设置百分比才会生效

亲测有效

希望可以帮助到同样遇到类似问题的小伙伴