vue裁剪gif图片并保持动画效果

这张图片有点大，请耐心等待2秒。

预览地址：点我就可以飞过去

二.思路

---

相当于就是取裁剪框在图片中的位置和宽高，再根据帧数，取绘制区域大小及四个顶点的坐标绘制一遍gif。

三.代码

---

上传图片

<input

type=“file”

style=“opacity: 0;”

accept=“image/gif,image/png,image/jpeg,image/jpg”

class=“cut-upload-file com-input-avatar”

ref=“J-uploadBtn”

id=“J-uploadBtn”

@change=“changeFile”

/>

请上传50M以内的图片!  支持GIF、PNG、JPG、JPEG

暂未裁剪图片！

<el-dialog

title=“裁剪”

:visible.sync=“cropFlag”

append-to-body

:destroy-on-close=“true”

<el-button @click=“closeCut()”>取 消

<el-button type=“primary” @click=“finishCut()” :loading=“cutLoading”

{{cutLoading?‘裁剪中…’:‘确定’}}</el-button