vue项目：el-upload上传svga图片

最新推荐文章于 2024-08-17 13:13:51 发布

kristen999

最新推荐文章于 2024-08-17 13:13:51 发布

阅读量1.4k

点赞数

文章标签： vue.js elementui javascript css

本文链接：https://blog.csdn.net/kristen999/article/details/122112564

版权

本文介绍了在Vue项目中利用ElementUI的el-upload组件上传SVGA图片的方法。首先通过npm安装svgaplayerweb依赖，然后在组件内引入并使用。在上传成功后，利用el-upload的回调函数结合SVG动画库在指定div上绘制图片，注意使用this.$nextTick避免渲染错误。

摘要由CSDN通过智能技术生成

1、首先，终端安装依赖

npm i svgaplayerweb --save

2、在需要使用的地方引入svga

import SVGA from 'svgaplayerweb';

例如：

3、接下来开始在el-upload中引入svga：

将upload中对应的img替换成：

<el-form-item label="动态图：" class="mallimg" prop="imgUrl">
  <el-upload class="avatar-uploader" :headers="headers" :action="actionUrl" 
     :show-file-list="false" :on-success="handleAvatarSuccess1"
     accept=".svga"
     :before-upload="beforeAvatarUpload1">
      <!-- <img v-if="formData.moveimgUr