element UI使用Upload 上传视频，图片

Posted 2023-03-09

参考技术A elementUI中 upload 的地址： https://element.eleme.cn/#/zh-CN/component/upload  大家可以参考官方文档

这里我使用的是照片墙这个属性：list-type

```javascript

<el-upload

  name="fileUpload"//上传文件的字段名字由后台提供

  :data="folderName"//文件存储的文件夹

  :action="这里的接口是后台提供的"

  list-type="picture-card"

  :on-success="successUpdata"

  :on-preview="handlePictureCardPreview"

  :on-remove="handleRemove">

<i class="el-icon-plus"></i>

</el-upload>

data

folderName: folderName:'ycylManage',



methods:

handleRemove(file, fileList)

console.log(file, fileList);

,

handlePictureCardPreview(file)

this.dialogImageUrl = file.url;

this.dialogVisible =true;

,

//上传成功的方法

successUpdata(file)

this.headImg = file.paths[0]   //返回的是图片的路径

,

图片示例：

经过试验这个上传是可以上传视频的，所以推荐大家用这个，上传图片与上传图片是一样的