Closed sickeeer closed 1 week ago
const valueFormatUpload = (event) => { const uuid = new Date().getTime() + Math.random().toString(36).substring(2, 8); let fileList = [...value]; const { file } = event.detail; // 组件问题,暂时未解决上传中状态标识 const tempFile = { ...file, status: "uploading", message: "上传中", fileId: uuid, }; fileList = fileList.concat(tempFile); setValue(fileList); upload(tempFile, uuid); }; const upload = (tempFile, uuid) => { const url = `${process.env.TARO_APP_BASEURL}/rest/attachTemporaryFile`; uploadFile({ url, filePath: tempFile.url, fileName: tempFile.originalFileObj.name, name: "file", formData: {}, success(res) { const result = res.temporaryAttachments?.[0]?.temporaryAttachmentId; setValue((v) => { let temp = v?.find((i) => (i.fileId = uuid)); if (!temp) { console.log(v); return v; } temp.trueUrl = result; temp.status = "done"; temp.message = null; return v; }); }, fail(res) { console.log("fail", res); setValue((v) => { let temp = v?.find((i) => (i.fileId = uuid)); console.log(temp); if (!temp) { return v; } temp.status = "failed"; temp.message = "上传失败"; return v; }); }, }); }; <Uploader fileList={value} compressed maxSize={10240000} onDelete={deleteFile} onOversize={onOversize} maxCount={8} // accept="all" previewImage deletable onAfterRead={valueFormatUpload} />
这是我写的一个例子,因为setState 会一并执行,导致页面仅渲染一次,一直停留到 loading 状态;可以出个官方示例,控制这个status么
https://antmjs.github.io/vantui/main/#uploader?target=%E4%B8%8A%E4%BC%A0%E7%8A%B6%E6%80%81
官网不是存在例子吗?
上传结束后如果需要更新状态,我实验下来这样子做就可以:
const updatedValue = ... // 更新完状态之后的 Uploader 值 setValue(updatedValue.concat([]) // 这样子就能够触发组件内部的 UI 更新
这是我写的一个例子,因为setState 会一并执行,导致页面仅渲染一次,一直停留到 loading 状态;可以出个官方示例,控制这个status么