element plus el-table 上的 tooltip 怎么使用
时间: 2023-11-29 12:06:27 浏览: 159
您可以在使用 `el-table` 组件时,使用 `el-tooltip` 组件来实现 `tooltip` 效果。可以将 `el-tooltip` 放在 `el-table-column` 的 `slot-scope` 中,然后将需要添加提示的内容放在 `el-tooltip` 的 `content` 属性中。
以下是一个示例代码:
```html
<template>
<el-table :data="tableData">
<el-table-column prop="name" label="姓名">
<template slot-scope="scope">
<el-tooltip :content="scope.row.name" placement="top">
<span>{{ scope.row.name }}</span>
</el-tooltip>
</template>
</el-table-column>
<el-table-column prop="age" label="年龄">
<!-- 其他列配置 -->
</el-table-column>
</el-table>
</template>
```
在上面的示例中,我们使用 `el-tooltip` 组件包裹了姓名列的内容,并将 `content` 属性设置为当前行的姓名值。这样,当鼠标悬停在姓名单元格上时,就会显示对应的提示信息。
请根据您的实际情况进行相应的调整和修改。希望对您有帮助!