TSX中上传图片到Cloudinary遇FormData类型错误求助

这个问题源于TypeScript遵循Web标准的FormData类型定义，但React Native的FormData实现额外支持带uri的对象结构，TS默认类型未覆盖这种场景。以下是几种可行的修复方案：

方案1：类型断言快速解决 #

直接通过类型断言绕过TS的类型检查，适合快速调试或临时修复：

data.append('file', { uri: image.path, type: 'image/jpeg', name: 'image.jpg' } as any);

方案2：扩展FormData类型定义（推荐） #

创建一个类型声明文件（比如src/types/react-native-formdata.d.ts），扩展FormData的append方法类型，让TS正式认可React Native的特殊格式：

declare global {
  interface FormData {
    append(
      name: string,
      value: string | Blob | { uri: string; type?: string; name?: string }
    ): void;
  }
}

export {};

添加该文件后，VS Code会自动识别扩展类型，红线错误将自动消失。

方案3：转为Blob上传（符合Web标准） #

如果想严格遵循Web标准，可以把本地图片转为Blob再上传，需要依赖react-native-fs模块：

1. 安装依赖：

npm install react-native-fs
# 或
yarn add react-native-fs

2. 修改上传代码：

import RNFS from 'react-native-fs';

// ... 其他代码 ...

const fileData = await RNFS.readFile(image.path, 'base64');
const blob = Blob.build(`data:image/jpeg;base64,${fileData}`, { type: 'image/jpeg' });
data.append('file', blob, 'image.jpg');

内容的提问来源于stack exchange，提问作者type