element ui表格设置border属性后拖动行表头,内容依旧是显示省略号
时间: 2024-02-18 09:04:49 浏览: 17
如果您在使用 Element UI 表格组件时设置了 `border` 属性,然后在拖动行表头时发现内容依旧显示省略号,可以尝试给表格的 `td` 元素设置 `white-space: normal` 样式,以解决内容显示不全的问题。
具体方法如下:
在表格组件的 `style` 中添加以下样式:
```css
.el-table__body td {
white-space: normal;
}
```
这样,当您拖动行表头时,表格的内容就能够完整地显示出来了。
相关问题
element ui表格设置border属性后拖动行,内容依旧是显示省略号
在 Element UI 表格中设置 border 属性后,拖动行时内容依旧显示省略号,可能是因为表格的列宽度设置过小,导致内容被截断。您可以尝试调整表格列的宽度,或者增加表格的宽度,以便内容能够完整显示。同时,您也可以尝试设置表格列的 ellipsis 属性为 false,这样可以取消内容的省略号显示。例如:
```
<el-table-column prop="name" label="姓名" width="120" :ellipsis="false"></el-table-column>
```
element ui表格设置border属性后拖动行表头,表内容的宽度随着表头自适应
如果您在使用 Element UI 表格组件时设置了 `border` 属性,然后在拖动行表头时发现表内容的宽度没有随着表头自适应,可以尝试使用 `fit` 属性来解决这个问题。
具体方法如下:
在表格组件上添加 `fit` 属性:
```html
<el-table :data="tableData" border :fit="true">
<!-- 表格列配置 -->
</el-table>
```
设置了 `fit` 属性后,表格的列宽会自适应表头的宽度,当拖动行表头时,列宽也会跟着自动调整。
注意:使用 `fit` 属性会使表格的列宽自适应,可能会影响到表格的显示效果,因此请根据实际情况选择是否使用。