一、原因 一般是因为el-table的父元素设置了flex:1导致。 二、解决方法 1. 在父元素中使用width:100%;父元素的父元素可使用flex: 1; 具体可参考下图 2. 不使用flex,使用具体宽度,或百分比,或calc 来设置表格宽度
<el-table-column prop="e" label="e" width="auto" min-width="5%"> </el-table-column> <el-table-column prop="f" label="f" width="auto" min-width="5%"> </el-table-column> <el-table-column prop="address" label="地址" width="auto" min-width="20%"> </el-table-column> </...
<script setup> const tableData = [ { date: '2016-05-03', name: 'Tom', address: 'No. 189, Grove St, Los Angeles' }, { date: '2016-05-02', name: 'Tom', address: 'No. 189, Grove St, Los Angeles' }, { date: '2016-05-04', name: 'Tom', address: 'No. 189, Grove S...
[Style] [table] el-table 添加类样式 table 并设置边框,导致表格宽度无限增加 #4861 Sign in to view logs Summary Jobs issue-open-check Run details Usage Workflow file Triggered via issue November 19, 2024 11:58 lihuixion opened #18947 b951e1a Status Success Total duration 14s Artifacts – ...
1. 解释el-table-column的宽度属性 el-table-column 是Element UI 框架中用于定义表格列的组件。其宽度属性用于控制列的显示宽度,以确保表格内容的合理展示。常见的宽度属性包括 width、min-width 和max-width。 width:设置列的固定宽度。 min-width:设置列的最小宽度,当表格宽度不足以容纳所有列时,此列至少会保...
// tableData为表格内容 // flag为可选值,可不传该参数,传参时可选'max'或'equal',默认为'max' // flag为'max'则设置列宽适配该列中最长的内容,flag为'equal'则设置列宽适配该列中第一行内容的长度。 str = str + '' let columnContent = '' ...
div.el-table__empty-block 不显示的时候,就可以正常了, 同理,表格有数据时,就没有问题。 解决方案 同事给那个table加了下面的就没问题了,也不知道为啥这样: .form-table { width: 100%; border-collapse: separate; table-layout: fixed; // 这一行是重点 } ©...
spm=1001.2100.3001.7377&utm_medium=distribute.pc_feed_blog_category.none-task-blog-classify_tag-3-140159085-null-null.nonecase&depth_1-utm_source=distribute.pc_feed_blog_category.none-task-blog-classify_tag-3-140159085-null-null.nonecase
如果el-table 自适应有限制,表格宽度最多为80,可以考虑以下几种方法来解决这个问题: 缩小表格列宽度:可以将每列的宽度缩小,以适应表格最大宽度的限制。这可以通过调整 el-table-column 的 width 属性或使用 column-width 属性来实现。 显示滚动条:将 el-table 的 scroll-x 属性设置为 true,可以在表格超出限制宽...
表格内容不一致,需要自适应宽度展示 二、方案一 场景:直接根据表格内容,动态设置宽度,适用于不同权限,内容减少 代码如下 <el-table-column label="操作"class-name="handle-column" :width="autoWidth"align="left" fixed="right"> </el-table-column> ...