vue+ant-design-vue中的a-upload上传文件
前端
anti-design-vue
vue.js
使用a-upload上传文件，需要对文件坐判断，
但是beforeupload方法还没走完，action上传方法就同步在上传了。@change方法也在同时进行
在Vue和Ant Design Vue中使用A-Upload上传文件时，可以使用before-upload方法来进行文件的判断和处理。然而，由于before-upload是异步的，而上传方法是同步的，所以可能会出现before-upload方法还没走完，而上传方法就已经开始执行的情况。为了解决这个问题，你可以使用Promise来确保before-upload方法执行完毕后再进行上传。
首先，在上传按钮的事件处理方法中，可以使用Promise来包装before-upload方法，确保它的执行完成：
handleUpload() {
return new Promise((resolve, reject) => {
// 调用before-upload方法，进行文件的判断和处理
this.beforeUpload()
.then(() => {
// before-upload方法执行完成，可以执行上传方法
this.uploadFile();
resolve(); // resolve Promise
})
.catch((error) => {
reject(error); // reject Promise
});
});
},
然后，在before-upload方法中，你可以使用Vue.nextTick方法来确保@change方法执行完毕后再进行判断和处理：
beforeUpload() {
// 返回一个Promise，在Promise中执行@change方法后再进行判断和处理
return new Promise((resolve, reject) => {
// 使用Vue.nextTick确保@change方法执行完毕
this.$nextTick(() => {
// 在这里进行文件的判断和处理
// …
resolve(); // resolve Promise
});
});
},
这样，无论是before-upload方法还是@change方法，都会按照顺序执行，确保在上传文件之前进行必要的文件判断和处理。