<el-table-column
label="姓名"
width="180">
<template slot-scope="scope">
<el-popover trigger="hover" placement="top">
<p>姓名: {{ scope.row.name }}</p>//鼠标覆盖后的内容
<p>住址: {{ scope.row.address }}</p>//鼠标覆盖后的内容
<div slot="reference" class="name-wrapper">
<el-tag size="medium">{{ scope.row.name }}</el-tag>//列表部分显示的数据
</div>
</el-popover>
</template>
</el-table-column>
出现的效果是列表显示按钮
同时可以不显示el-tag的样式
直接用p改个颜色就好
<el-table-column
label="姓名"
width="180">
<template slot-scope="scope">
<el-popover trigger="hover" placement="top">
<p>姓名: {{ scope.row.name }}</p>//鼠标覆盖后的内容
<p>住址: {{ scope.row.address }}</p>//鼠标覆盖后的内容
<div slot="reference" class="name-wrapper">
<p style="color:blue;">{{ scope.row.name }}</p>//列表部分显示的数据
</div>
</el-popover>
</template>
</el-table-column>
就是一个带颜色的文字,
按钮形式的容易误导用户以为是可以点击的