elementUi 通过 previewSrcList 预览大图
如果是希望 根据 自己定义的事件来触发方法,然后 显示大图的话,需要给图片加一个 ref=”preview”
类似这样:
<div class="el-upload-list__item is-success image-upload avatar" >
<el-image class="flex-img__image"
ref="preview"
:src="imageConfig.imageUrl"
:preview-src-list="imageConfig.srcList"
@click="handlePictureCardPreview"
style="width: 100%; height: 100%">
</el-image>
<label class="el-upload-list__item-status-label">
<i class="el-icon-upload-success el-icon-check"></i>
</label>
<span class="el-upload-list__item-actions">
<span @click="handlePictureCardPreview"><i class="el-icon-zoom-in" :preview-src-list="imageConfig.srcList"></i></span>
<span class="el-upload-list__item-delete"><i class="el-icon-delete" @click.stop="handleRemove()"></i></span>
</span>
</div>
我这里 在图片上方还放了俩 icon 所以无法直接 点击图片 显示大图,于是 我就 给 图片 加了一个ref=”preview”
然后 给
<span @click="handlePictureCardPreview">
<i class="el-icon-zoom-in" :preview-src-list="imageConfig.srcList"></i>
</span>
这里 加了一个点击事件:
handlePictureCardPreview() {
this.$refs.preview.clickHandler()
},
注意 这个 方法 来源于:www.cnblogs.com/duhui/p/15117803.h...