ElementUI表格中显示图片,悬浮显示放大图片

在这里插入图片描述
使用弹出框

<el-table-column
    prop="carImg"
    label="车辆图片">
    <template slot-scope="scope">
        <el-popover
              placement="right"
              :title="scope.row.carId + pictureTitle"
              trigger="hover">
            <img :src="huaWeiUrl+scope.row.carImg"/>
            <img slot="reference" :src="huaWeiUrl+scope.row.carImg"  style="max-height: 50px;max-width: 150px">
        </el-popover>
    </template>
</el-table-column>
//本人华为云服务器图片地址,
huaWeiUrl:'https://leitianquan.obs.cn-north-4.myhuaweicloud.com/',
//放大图片标题
pictureTitle:'号车辆'
发布了55 篇原创文章 · 获赞 14 · 访问量 6244

猜你喜欢

转载自blog.csdn.net/qq_41154522/article/details/104597734