问题复现：

 源代码段：

<el-table-column prop="id" label="ID" width="80" align="center" sortable/>
<el-table-column label="头像" width="85px">
    <template #default="scope">
        <el-image
            style="width: 60px;height: 60px;"
            :src="scope.row.avatar"
            :preview-src-list="[scope.row.avatar]"
            hide-on-click-modal="true">
            <template #error>
              <div class="image-slot">
                <el-icon><user /></el-icon>
              </div>
            </template>
          </el-image>
    </template>
</el-table-column>
<el-table-column prop="username" label="用户名" width="130"/>

解决：

官网文档有这么一个属性，官网是这个描述的（Image 属性）

 于是尝试了在<el-image>中加入属性

preview-teleported="true"

修改后代码段

<el-table-column prop="id" label="ID" width="80" align="center" sortable/>
<el-table-column label="头像" width="85px">
    <template #default="scope">
          <el-image
            style="width: 60px;height: 60px;"
            :src="scope.row.avatar"
            :preview-src-list="[scope.row.avatar]"
            hide-on-click-modal="true"
            preview-teleported="true">
            <template #error>
              <div class="image-slot">
                <el-icon><user /></el-icon>
              </div>
            </template>
        </el-image>
    </template>
</el-table-column>
<el-table-column prop="username" label="用户名" width="130"/>

最后解决​​​​​​​