element小计

#select 获取label

this.$refs['projectSelect'].selectedLabel

#、upload

多文件上传

     <el-upload
        multiple
        class="upload-demo"
        ref="upload"
        action=""
        :file-list="fileList"
        :auto-upload="false"
        :accept="accType"
        :list-type="listype"
        :limit="limtNum"

        :before-upload="beforeAvatarUpload"
        :on-change="handleChange"
        :on-remove="handleRemove"
        :on-exceed="handleExceed"
        :on-success="onsuccess"
        :on-error="onErrors"
        :http-request="uploadFile"
      >
        <el-button slot="trigger" size="small" type="primary">选取文件</el-button>
        <el-button style="margin-left: 10px;" size="small" type="success" @click="submitUpload">上传到服务器</el-button>
        <div slot="tip" class="el-upload__tip">只能上传 png、jpg、jpeg,且不超过500kb</div>
      </el-upload>


    data() {
      return ({
        fileList: [], // // 上传文件列表
        upimgList: [],//展示已上传图片
        fileData: '',//上传方法传参
        accType: this.validate.acceptFile('img'),
        listype: 'picture',
        limtNum: 10,
        imgRealPath: '',
        absolutePath:'',//上传图片保存地址,用于二次上传
        domainUrl: process.env.source_request_PATH,//拼接图片
        dialogUploadVisible: false,//显示上传弹框
      })
    },


export function acceptFile(e) {
  const allowHook = {
    video: '.mp4, .ogv, .ogg, .webm',
    audio: '.wav, .mp3, .ogg, .acc, .webm, .amr',
    file: '.doc,.docx,.xlsx,.xls,.pdf',
    excel: '.xlsx,.xls',
    img: '.jpg, .jpeg, .png, .gif'
  }
  if (e) {
    return allowHook[e];
  }
  let srt = null
  for (const k in allowHook) {
    srt += allowHook[k]
  }
  return srt
}



   // 上传文件
      uploadFile(file) {
        this.fileData.append('file', file.file); // append增加数据
      },


 // 上传到服务器
      submitUpload() {
        if (!this.fileList.length) {
          return this.$message.error("请选择图片上传")
        }
        const isLt100M = this.fileList.every(file => this.beforeAvatarUpload(file));
        if (isLt100M) {
          this.fileData = new FormData(); // new formData对象
          this.$refs.upload.submit(); // 提交调用uploadFile函数
          this.absolutePath ? this.fileData.append("absolutePath", this.absolutePath) : '';

          this.$http.post(process.env.VUE_APP_PATH + '/uploadimg', this.fileData).then((res) => {
            let result = res.data;
            if (result.code === 200) {
              this.upimgList = result.data.imgList;
              this.absolutePath = result.data.absolutePath;
              this.imgRealPath = result.data.imgRealPath;
              this.$message.success("上传成功");
              this.fileList = [];
            } else {
              this.$message.error(result.message);
            }
          })
            .catch((err) => {
              console.error(err)
            })
        }

      },

  • 0
    点赞
  • 0
    收藏
    觉得还不错? 一键收藏
  • 0
    评论

“相关推荐”对你有帮助么?

  • 非常没帮助
  • 没帮助
  • 一般
  • 有帮助
  • 非常有帮助
提交
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值