zoukankan      html  css  js  c++  java
  • 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=" 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) { } },
  • 相关阅读:
    让人难以想出的动态转移方程小集
    初识DP
    CSP复赛day2模拟题
    通知
    未完成作业
    2019年东莞特长生 散步
    营救
    农场主
    安全密码
    开发区规划
  • 原文地址:https://www.cnblogs.com/fczbk/p/14439634.html
Copyright © 2011-2022 走看看