vue element ui table 列表显示隐藏怎么写
时间: 2023-10-14 15:12:59 浏览: 99
你可以使用 Element UI 表格组件的 `show-overflow-tooltip` 属性来控制表格列的显示和隐藏。该属性默认为 `false`,直接隐藏溢出的内容并显示 tooltip。当你将其设置为 `true` 时,表格列将不会被隐藏,而是可以通过鼠标滚动来查看。
另外,你还可以使用 `min-width` 属性来设置列的最小宽度,以确保不会出现隐藏列的情况。以下是一个使用 `show-overflow-tooltip` 和 `min-width` 属性来控制表格列的例子:
```html
<el-table :data="tableData" show-overflow-tooltip>
<el-table-column prop="name" label="姓名" :min-width="100"></el-table-column>
<el-table-column prop="age" label="年龄" :min-width="80"></el-table-column>
<el-table-column prop="gender" label="性别" :min-width="80"></el-table-column>
<el-table-column prop="address" label="地址" :min-width="200"></el-table-column>
</el-table>
```
在上面的例子中,当每列的内容超出该列所设置的最小宽度时,该列将会显示 tooltip。如果你不希望显示 tooltip,可以将 `show-overflow-tooltip` 属性设置为 `false`。
阅读全文