You need to enable JavaScript to run this app.
优惠活动
大模型
产品
解决方案
定价
更多

安装expo-image-picker后触发TypeError: undefined is not an object错误

问题:Expo RN中使用expo-image-picker出现TypeError错误

此问题与《安装react-native-image-picker后出现“TypeError: null is not an object”》同步发布,因不确定二者根因是否不同。

我正尝试在Expo RN应用中实现图片选择功能,package.json依赖如下:

"expo": "~48.0.15",
"expo-image-picker": "^14.1.1",
"react": "18.2.0",
"react-native": "0.71.8",

实现代码:

import * as ImagePicker from 'expo-image-picker';
...

const handleChoosePhoto = async () => {
    let result = await ImagePicker.launchImageLibraryAsync({
        mediaTypes: ImagePicker.MediaTypeOptions.All,
        allowsEditing: true,
        aspect: [4, 3],
        quality: 1,
    });
    console.log(result);
}

[后续有TouchableOpacity在onPress时调用handleChoosePhoto]

遵循Expo官方文档实现,但运行时出现错误:

WARN  Possible Unhandled Promise Rejection (id: 0):
TypeError: undefined is not an object (evaluating '_ExponentImagePicker.default.launchImageLibraryAsync')

使用Expo开发构建环境,已尝试以下操作:

  • 更新react-native从0.70.5到0.71.8
  • 更新expo从47到48
  • 安装react-native-image-picker后执行npx pod-install
  • 修改metro.config.js解决DatePickerIOS相关错误(认为与当前问题无关)

请问问题出在哪里?

解决方案
  • 清理冲突的图片选择库:你同时引入了expo-image-picker和react-native-image-picker,这是两个独立的库,Expo项目只需要保留expo-image-picker,先卸载冲突库:

    npm uninstall react-native-image-picker
    # 或使用yarn
    yarn remove react-native-image-picker
    
  • 重新生成开发构建包:Expo开发构建(Development Builds)在安装/更新原生模块后,必须重新编译构建包,仅清除缓存无效。执行对应平台的构建命令:

    # iOS平台
    eas build --profile development --platform ios
    # Android平台
    eas build --profile development --platform android
    
  • 确认权限配置:在app.json或app.config.js中添加图片选择所需的权限声明,添加后同样需要重新构建:

    "expo": {
      "plugins": [
        [
          "expo-image-picker",
          {
            "photosPermission": "需要访问您的相册以选择图片",
            "cameraPermission": "需要访问您的相机以拍摄照片"
          }
        ]
      ]
    }
    
  • 添加错误捕获优化代码:给图片选择逻辑添加try/catch,避免未处理的Promise拒绝,同时确保调用逻辑正确:

    const handleChoosePhoto = async () => {
      try {
        let result = await ImagePicker.launchImageLibraryAsync({
            mediaTypes: ImagePicker.MediaTypeOptions.All,
            allowsEditing: true,
            aspect: [4, 3],
            quality: 1,
        });
        if (!result.canceled) {
          console.log(result);
        }
      } catch (error) {
        console.error('图片选择出错:', error);
      }
    }
    

内容的提问来源于stack exchange,提问作者Allen Y

相关产品推荐
方舟 Agent Plan

超全模态模型 × Harness 升级,最新支持 Deepseek-V4.1-Flash、GLM-5.3 系列、Doubao-Seedream-5.0-pro、Kimi-K3 (部分), 限时 9.9 元起

最近更新时间:2026.07.21 05:00:42