使用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
}