elementUi框架中有el-image,这个组件可以放大,缩小,旋转图片。适用于一般通用性业务,但是有下载需求的话这个就满足不了,需要自己手动撸一管下载按钮来实现下载功能
效果图
实现思路
1.创建下载按钮图标
2.把创建的下载图标放到和旋转放大同一行内
3.监听图标按钮点击事件
4.实现下载原图
```html
<template>
<div >
<el-image
style="width: 40px; height: 40px; margin-top: 5px; margin-right: 5px"
:src="src"
:fit="fit"
:preview-src-list="allLi"
:scroll-container="scrollContainer"
lazy
@click="clickImage"
></el-image>
</div>
</template>
<script>
export default {