2025-12-28 不能将类型“(options: any) => Promise<AxiosResponse<any, any> | undefined>”分配给类型“(option: RequestOption) => UploadRequest”。不能将类型“Promise<AxiosResponse<any, any> | undefined>”分配给类型“UploadRequest”。
报错代码为acro-design-vue的upload组件::custom-request="handleUpload"
报错内容为:
不能将类型“(options: any) => Promise<AxiosResponse<any, any> | undefined>”分配给类型“(option: RequestOption) => UploadRequest”。
不能将类型“Promise<AxiosResponse<any, any> | undefined>”分配给类型“UploadRequest”。
类型“Promise<AxiosResponse<any, any> | undefined>”中缺少类型“string”的索引签名。
报错原因:我自定义的handleUpload方法没有返回custom-request期望的对象,需要返回一个包含 abort 方法的对象给custom-request,而不是返回一个Promise!
你可以参考一下官方的写法:
<template> <a-upload :custom-request="customRequest" /> </template> <script> export default { setup() { const customRequest = (option) => { const {onProgress, onError, onSuccess, fileItem, name} = option const xhr = new XMLHttpRequest(); if (xhr.upload) { xhr.upload.onprogress = function (event) { let percent; if (event.total > 0) { // 0 ~ 1 percent = event.loaded / event.total; } onProgress(percent, event); }; } xhr.onerror = function error(e) { onError(e); }; xhr.onload = function onload() { if (xhr.status < 200 || xhr.status >= 300) { return onError(xhr.responseText); } onSuccess(xhr.response); }; const formData = new FormData(); formData.append(name || 'file', fileItem.file); xhr.open('post', '//upload-z2.qbox.me/', true); xhr.send(formData); return { abort() { xhr.abort() } } }; return { customRequest } }, } </script>
或者参考一下我的也行:
const handleUpload = (options: any) => { const { fileItem, onSuccess, onError, onProgress } = options; const file = fileItem.file; // 创建取消令牌 const CancelToken = axios.CancelToken; const source = CancelToken.source(); // 执行上传 const formData: any = new FormData(); formData.append('file', file); axios.post('接口', formData, { onUploadProgress: (progressEvent: any) => { if (progressEvent.total) { const percent = Math.round((progressEvent.loaded * 100) / progressEvent.total); onProgress?.(percent); } }, cancelToken: source.token }) .then(response => { onSuccess?.(response.data); Message.success('文件上传成功'); }) .catch(error => { if (!axios.isCancel(error)) { onError?.(error); Message.error(`上传失败: ${error.message || '未知错误'}`); } }); // 同步返回包含 abort 方法的对象 return { abort() { source.cancel('上传已取消'); } }; };

浙公网安备 33010602011771号