文章目录
- 问题
- 解决
问题
视觉
点击图片进行预览，但还能继续选中其他的图片进行预览，鼠标放在表格上，那一行表格也会选中，如图所示第一行的效果。
代码
<el-table-column prop="id" label="ID" width="80" align="center" sortable/>
<el-table-column label="商品图片" width="85px"><template #default="scope"><el-imagestyle="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 label="商品图片" width="85px"><template #default="scope"><el-imagestyle="width: 60px; height: 60px;":src="scope.row.avatar":preview-src-list="[scope.row.avatar]"hide-on-click-modal="true"preview-teleported="true"></el-image></template> </el-table-column>
)
