el-table-column 显示图片
时间: 2023-11-22 21:44:26 浏览: 385
显示图片
可以使用 el-table-column 的 scoped slot 来自定义列的内容,具体实现如下:
```html
<el-table :data="tableData">
<el-table-column prop="imageUrl" label="图片">
<template slot-scope="scope">
<img :src="scope.row.imageUrl" style="width: 100px; height: 100px;">
</template>
</el-table-column>
</el-table>
```
其中,`prop` 属性指定了该列对应数据项的属性名,`label` 属性指定了该列的标题。在 scoped slot 中,可以通过 `scope.row` 访问到当前行的数据,从而获取到该行对应的图片地址。
阅读全文