在文件上传时想要展示真实上传文件百分比,无奈uni.showloading入参是一个静态的对象,不会动态更新
所以找到了plus.nativeUI.showWaiting方法, 使用实例的setTitle方法动态写入
// !!!watch中,注意nativeWaiting对象
watch: {
progressText: {
handler: function(v) {
if(v) {
this.nativeWaiting.setTitle(v);
} else if(this.nativeWaiting){
this.nativeWaiting.close()
}
},
immediate: true,
},
},
methods: {
async selectVideo() {
let _vm = this;
if (this.mediaLength >= 6) {
let isContinue = await this.isFullImg();
if (!isContinue) {
return;
}
}
let soType = sourceType[this.sourceTypeIndex];
let siType = sizeType[this.sizeTypeIndex];
uni.chooseVideo({
sourceType: soType,
compressed: true,
success: (chooseImageRes) => {
_vm.showLoading();
_vm.uploadFile(true, chooseImageRes.tempFilePath);
}
});
},
showLoading() { // 实例化plus.nativeUI
this.nativeWaiting = plus.nativeUI.showWaiting('准备上传',{
width: '25%',
loading: {
display: 'block',
type: 'snow'
}
});
},
uploadFile(isVideo, filesPath) {
// 记录返回对象,便于获取对象进度
let uploadTask = uni.uploadFile({
url: REQ_PREFIX + '/trialProduceExamine/saveTrialProduceExamineAttach',
files: imageVideoList,
fileType: fileType,
timeout: 6000000,
header: {
// 'content-type': 'multipart/form-data'
'access_token': this.userCode+'_'+token
},
name: 'file0',
formData: {
siteCode: this.siteCode
},
success: (uploadFileRes) => {
}
}
uploadTask.onProgressUpdate((res) => {
_vm.progressText = res.progress + '%';
_vm.percent = res.totalBytesSent + '/' + res.totalBytesExpectedToSend;
if(res.progress === 100) {
_vm.progressText = '上传完成';
setTimeout(() => {
_vm.progressText = '';
}, 1500)
}
});
}
}