【ElementUI】一行代码解决图片预览

【ElementUI】一行代码解决图片预览


只需要在图片标签上加入:preview-src-list

  完整代码如下:

python 复制代码
<el-table-column label="封面" align="center" prop="cover" :sort-orders="['descending','ascending']" sortable="custom">
    <template slot-scope="scope">
        <el-image
                v-if="scope.row.cover"
                style=" height: 50px"
                :src="scope.row.cover"
                :preview-src-list="[scope.row.cover]"
        >
        </el-image>
    </template>
</el-table-column>
相关推荐
雪芽蓝域zzs1 天前
第十节:动态侧边栏菜单(根据路由 meta 自动渲染菜单)
javascript·vue.js·elementui
m0_579146655 天前
Element UI 表格合并单元格完全指南:从原理到实战
前端·vue.js·elementui
常宇佳7 天前
vue3 实战系列之踩过的一些坑
javascript·vue.js·elementui
aXin_ya10 天前
ElementUI (01):Vue2 项目引入 ElementUI使用
elementui·vue
山川志~11 天前
Vue + Element UI 实战:如何实现表格时间、金额字段排序
vue.js·ui·elementui
Sterting18 天前
Form表单与校验
javascript·vue.js·elementui
Sterting20 天前
Element-Plus 入门与整体布局
前端·vue.js·elementui
yume_sibai20 天前
Element Plus 基础组件完全指南(12个核心组件)
前端·elementui
di24k24k1 个月前
多个 el-form 共用同一 ref 导致表单校验部分失效
前端·javascript·vue.js·elementui
森林的尽头是阳光1 个月前
tree回显问题
javascript·vue.js·elementui