zoukankan      html  css  js  c++  java
  • vue的change方法无法选择上传相同文件/el-uploader/type="file"


    使用h5自带的input type=file时,使用change触发上传事件

    <input class="exportss" type="file" id="fileExport" @change="handleFileChange" ref="inputer">
    const inputDOM = this.$refs.inputer
          this.file = inputDOM.files[0] // 通过DOM取文件数据
          let size = Math.floor(this.file.size / 1024)
          this.formData = new FormData() // new一个formData事件
          this.formData.append('file',data.file)
          this.formData.append('xxx', xxx)
          this.formData.append('yyy', yyy)
        inputDatas(this.formData).then(response => {
        })

    或者使用element的el-uploader

    <el-upload
                      ref="upload"
                      :data="inputdata"
                      class="upload-demo"
                      :action="uploadUrl"
                      :show-file-list="false"
                      :on-preview="onpreview"
                      :before-upload="beforeAvatarUpload"
                      :on-error="handleError"
                      :on-success="handleSuccess"
                      :file-list="fileList">
                      <el-button :loading="loadings.isInport" icon="el-icon-upload" size="mini" type="primary">导入</el-button>
                    </el-upload>

    action为上传文件的地址,可手动拼接

    若需要token验证,可添加:header="header"

    headers: {
       Authorization: Cookies.get('token') 
       //从cookie里获取token,并赋值 Authorization ,而不是token
    }


    浅喜似苍狗,深爱如长风
  • 相关阅读:
    接口测试基础
    python学习笔记(一)
    Charles学习笔记
    接口测试笔记
    【CSS】Beginner5:Margins&Padding
    【CSS】Beginner4:Text
    【CSS】Beginner3:Color
    【CSS】Beginner2:Selectors, Properties, and Values
    【CSS】Beginner1:Applying CSS
    【HTML】Beginner9:Form
  • 原文地址:https://www.cnblogs.com/Zhang-jin/p/12987782.html
Copyright © 2011-2022 走看看