<el-upload
class="upload-demo"
:action="后台接收地址"
:on-preview="handlePreview"
:on-remove="handleRemove"
:before-remove="beforeRemove"
:on-success="refreshData"
:on-error="OnError"
:headers="setHeader()"
:data="setData()"
:before-upload="beforeUpload"
multiple
:limit="3"
:on-exceed="handleExceed"
:file-list="fileList"
>
<el-button size="small" type="primary" @click="clickBefore">点击上传</el-button>
<div slot="tip" class="el-upload__tip">Only upload csv file, and each size can not exceed 100Mb </ div> function:
</ EL-the Upload>
// hook when the file list to remove files
handleRemove (file, fileList) {} ,
incidental to upload additional parameters //
setData () {
return {
'project_id': this.analyseForm.project_id
}
},
// set upload request header
the setHeader () {
the let org_ID = ''
for (the let I = 0; I <this.projectArr.length; I ++) {
IF (this.projectArr [I] .id === this.analyseForm.project_id) {
= this.projectArr org_ID [I] .org_id
BREAK
}
}
const = the JSON.parse token (sessionStorage.getItem ( 'token'))
const = the JSON.parse info (sessionStorage.getItem ( 'info'))
return {
'X- ORG-requested ': org_ID,
' token ': token,
' ACCOUNT_ID ': info.account_id
}
}
// click on the file list when the hook uploaded file
handlePreview (file) {},
hook when the // file exceeds the number of restrictions
handleExceed (Files, fileList) {
the this. $ Message.warning ( `current limit select three files, this selected file $ {files.length}, were selected $ {files.length + fileList.length} files')
},
the hook when the file upload successfully //
RefreshData () {
the this .getBillingHistory ()
},
the hook when the failed files //
the OnError (ERR, file, the fileList) {
the this. Message.Error An $ ( 'failed files')
},
clickBefore () {
IF (= this.analyseForm.project_id == '') {
the this. Message.Error An $ ( 'select the item')
}
},
before uploading files // hook
beforeUpload (file) {
IF (this.analyseForm.project_id === '') {
return false
The else {}
IF (file.type === 'text / CSV') {
// return to true
IF (file.size / 1024/1024 <100) {
return to true
} {the else
the this. Message.Error An $ ( 'file upload size can not exceed 100MB! ')
return false
}
} {the else
the this. $ Message.Error An (' Please upload csv file! ')
return false
}
}
},
// delete files before the hook
beforeRemove (file, fileList) {
IF ( === file.type 'text / CSV' && file.size / 1024/1024 <100) {
return the this. Confirm $ ( `determined removed file.name} {$?`)
}
},