首页 > 编程技术 > js

element el-image放多张图片 显示大图

发布时间:2021-5-20 16:37 点击:37

element el-image组件多张图片有小图,点击小图显示大图


element el-image组件多张图片有小图,点击小图显示大图

vue文件


html

 <div class="el-image">
      <el-image lazy v-for="(ele,index) in picture.piclist" :key="index" style="width: 100px; height: 100px;margin:5px" 
      :src="picture.piclist[index]"  :preview-src-list="picture.piclist"></el-image>
 </div>


其中picture.piclist :// 接口返回的 图片url数组对象



小图显示样式

.el-image {
    position: relative;
    display: inline-block;
    overflow: hidden;
}



您可能感兴趣的文章:

相关文章