Element upload 组件实现自定义上传功能

<el-form-item label="照片">
  <el-upload
    v-if="operType !== 'details'"
    ref="upload"
    class="upload-demo"
    accept='.jpg,.png'
    :action="`${httpConfig.hashUrl}/sys/core/file/upload.do`"
    :show-file-list="false"
    :before-upload="beforeAvatarUpload"
    :on-success="handleAvatarSuccess"
    :http-request="uploadFile">
    <el-button size="small" type="primary">点击上传</el-button>
    <div slot="tip" class="el-upload__tip">只能上传jpg/png文件,且不超过500kb</div>
  </el-upload>
  <img style="width: 200px" v-if="imageUrl" :src="imageUrl" class="avatar">
  <span v-if="!imageUrl && operType === 'details'">--</span>
</el-form-item>
async uploadFile(files) { try { var formData = new FormData(); formData.append("file", files.file); formData.append("types", "Image"); formData.append("id", files.file.uid); formData.append("name", files.file.name); formData.append("type", files.file.type); formData.append("lastModifiedDate", files.file.lastModifiedDate); formData.append("size", files.file.size); formData.append("from", 'SELF'); const { data } = await fileUpload(formData) this.form.photo = data[0].fileId } catch (error) { } },

 

posted @ 2021-02-24 10:00  爱放屁的菜鸟  阅读(426)  评论(0编辑  收藏  举报