vue中如何能够在el-table-column显示图片

在 Vue 中，可以通过在 `el-table-column` 中使用插槽（slot）来自定义列的内容。要在列中显示图片，可以在插槽中添加 `img` 标签。

以下是一个示例代码：

<template>
  <el-table :data="tableData">
    <el-table-column prop="name" label="姓名"></el-table-column>
    <el-table-column prop="avatar" label="头像">
      <template slot-scope="scope">
        <img :src="scope.row.avatar" width="50" height="50">
      </template>
    </el-table-column>
  </el-table>
</template>

<script>
export default {
  data() {
    return {
      tableData: [
        { name: '张三', avatar: 'https://example.com/avatar1.png' },
        { name: '李四', avatar: 'https://example.com/avatar2.png' },
        { name: '王五', avatar: 'https://example.com/avatar3.png' }
      ]
    }
  }
}
</script>

在上述代码中，我们在 `el-table-column` 中添加了一个插槽，使用了 `scope` 作为插槽的参数。通过 `scope.row.avatar` 获取到该行数据中的头像地址，并将其作为 `img` 标签的 `src` 属性值。

注意：在 Vue 中，我们可以使用 `v-bind` 指令简写为 `:`，例如 `:src` 等价于 `v-bind:src`。