vue el-upload上传文件的示例代码

话不多说 直接上代码

<el-upload
      :action="actionUrl"
      class="avatar-uploader"
      :multiple="false"
      name="files"
      ref="upload"
      :file-list="fileList"
      :on-preview="handlePreview"
      :on-success="handleSuccess"
      :before-upload ="beforeUpload"
      :http-request="httpRequest"
      :on-exceed="handleExceed"
      :on-change="handleChanged"
      accept=".csv,.xls,.xlsx"
      :auto-upload="false"
     >
<el-button slot="trigger" size="small">选取文件</el-button>
<el-button style="margin-left: 10px;" size="small" type="primary" @click="submitUpload">上传到服务器</el-button>
<div slot="tip" class="el-upload__tip">只能上传csv/xslx/xsl文件，且不超过1M</div>
</el-upload>

actionUrl: `${env.imgCaptchaUrl}**/upload`,
fileList: [],

handleChanged(file,fileList){
  this.fileList = fileList
 },
 handleExceed (file, fileList) {
  console.log(file);
 },
 handleSuccess (res, file) {
  console.log(file);
  console.log(res);
 },
 handlePreview(file){
  console.log(file);
 },
 beforeUpload (file) {
  if (file.size / 1024 / 1024 > 1) {
   Vue.$vux.toast.text('上传文件不超过1M')
   return false
  }
  var ext = file.name.substring(file.name.lastIndexOf('.') + 1)
  const extension =
   ext === 'csv' ||
   ext === 'CSV' ||
   ext === 'xlsx' ||
   ext === 'xls'
  if (!extension) {
   Vue.$vux.toast.text('上传文件格式只能为csv、xlsx/xls')
   return false
  }
 },
 httpRequest (opt) {
  const _this = this
  const file = opt.file
  Vue.$vux.toast.text('文件上传中...')
  var reader = new FileReader()
  reader.readAsDataURL(file)
  reader.onload = function (e) {
   let imgType = ''
   var ext = file.name.substring(file.name.lastIndexOf('.') + 1)
   if (ext === 'csv' ) {
    imgType = 'csv'
   }
   if (ext === 'xlsx' || ext === 'xls') {
    imgType = 'xlsx'
   }
   uploadCsv({
    files: this.result.replace(`data:image/${imgType};base64,`, '')
   })
    .then(res => {
     if (res.errno === 0) {
      Vue.$vux.toast.text('上传成功')
      _this.account.license_url = res.data.url
     }
    })
    .catch(err => {})
  }
 },
 submitUpload(){
  if(this.fileList.length==0){
   this.successDialog = "请先选择文件";
   this.sussAlog = true;
   return
  }
  this.$refs.upload.submit();
 },

onDownload(){
  let start = ""
  let end = ""
  if(this.form.time){
   start = parseTime(this.form.time[0]);
   end = parseTime(this.form.time[1]);
  }
  delete(this.form.time)
  Object.assign(this.form, {
   first_time: start,
   end_time: end ,
  });
  let {
     first_time,
     end_time,
    } = this.form;
  window.open(this.downUrl+"lm/downloadModel?"+
  "&first_time="+first_time+
  "&end_time="+end_time
  , '_blank');
 },

来源：https://www.cnblogs.com/yangsg/p/13182228.html