a-upload(檔案上傳)元件change事件怎麼傳參;以及限制只上傳一個檔案,再次上傳時替換(覆蓋)以前的檔案
阿新 • • 發佈:2021-06-28
一:html結構(change事件傳參函式改變)
<a-upload name="file" :multiple="true" accept=".zip,.json" :before-upload="beforeUpload" :remove="projectHandleRemove" @change="value => handleChange(value, record)"> <div @click="storageId(record)"> <a-button :disabled="!record.value||!record.value2"> <a-icon type="upload" /> 上傳動效檔案 </a-button> </div> </a-upload>
二:js部分(handleChange函式接受引數改變)
// 檔案上傳(value則是新傳遞過來的引數) handleChange(data, value) { let that = this if (value.fileName) { value.fileName = '' } if (data.fileList.length > 1) {//限制只上傳一個檔案,再次上傳時則替換(覆蓋)以前的檔案 data.fileList.splice(0, 1) } this.$nextTick(() => { const formData = new FormData() formData.append('app', 'suprised-file') formData.append('file', data.file) const file = data.file wxUploadCos({ file, cosCode:'suprised-file', loadingTitle: '上傳中', originFileObj: data.file }).then(res => { if (res.data) { that.packageUrl = res.domain + res.path const params = { 'columnId': that.columnId, 'filePath': that.packageUrl, 'width': value.value, 'height': value.value2 } postAction(that.url.uploading, params).then((res) => { that.$message.success(res.msg || '操作成功') }).catch((err) => { that.$message.warning(err.msg || '操作失敗,請稍後再試') }) } else { that.$message.warning(String(res.msg) || '檔案上傳失敗') } }).catch(() => { // that[picType + 'List'][0].status = 'error' }) }) }