el-table单元格右键弹出el-popover
时间: 2023-11-23 08:54:33 浏览: 248
记录让Element-UI的ElPopover组件支持鼠标右键弹出
可以通过在el-table-column中使用slot-scope来获取每一行的数据,然后在el-popover中使用该数据来显示弹出内容。具体实现方法如下所示:
```
<el-table-column label="操作">
<template slot-scope="{row}">
<el-popover
placement="top-start"
width="200"
trigger="click"
:content="row.content"
>
<el-button slot="reference" type="text">{{ row.title }}</el-button>
</el-popover>
</template>
</el-table-column>
```
其中,row是每一行的数据对象,可以根据实际情况修改content和title属性来显示不同的内容。在el-popover中,使用slot="reference"来指定触发弹出的元素,这里使用了el-button来触发弹出。
阅读全文