通过 Scoped slot 可以获取到 row, column, $index 和 store(table 内部的状态管理)的数据,
slot-scope="scope" 取到当前单元格
scope.row 获得当前的行数据
scope.$index 当前下标
添加图片
<el-table
stripe="true"
:data="tableData"
style="width: 100%"
>
<el-table-column prop="date" label="模型名称"> </el-table-column>
<!-- //图片 -->
<el-table-column label="公式">
<template slot-scope="scope" v-if="scope.row.img">
<el-popover placement="top-start" title="" trigger="hover">
<img
:src="scope.row.img"
alt=""
/>
<img
slot="reference"
:src="scope.row.img"
style="width: 100px; height: 40px"
/>
</el-popover>
</template>
</el-table-column>
</el-table>
添加按钮弹窗
<el-table-column prop="address" label="指标因子">
<template slot-scope="scope">
<el-button size="mini" @click="handleEdit(scope.$index, scope.row)"
>查看</el-button
> //scope.row获得当前的行数据,scope.$index当前下标
</template>
</el-table-column>
<script>
handleEdit(index, row) {
this.$alert(`111`, "指标因子", {
confirmButtonText: "确定",
});
},
</script>