使用react-native-media-library遇TypeError: null is not an object错误求助

• 检查库的安装与链接

  1. 确认已正确安装依赖：执行 npm install react-native-media-library 或 yarn add react-native-media-library
  2. React Native 0.60+ 支持自动链接，但iOS需手动执行 npx pod-install 确保依赖安装完成
  3. 重置Metro缓存并重启服务：npx react-native start --reset-cache，缓存未清理可能导致模块加载异常

• 验证导入方式正确性
  错误的导入会导致无法获取MediaType，确保使用以下正确写法：

  // 方式一
  import MediaLibrary from 'react-native-media-library';
  // 方式二
  import { MediaLibrary } from 'react-native-media-library';
  

  避免拼写错误或使用错误的库名。

• 配置平台权限
  权限未配置会导致库初始化失败，返回null：

  • iOS：在Info.plist中添加相册权限描述

    <key>NSPhotoLibraryUsageDescription</key>
    <string>需要访问您的相册来管理媒体文件</string>
    <key>NSPhotoLibraryAddUsageDescription</key>
    <string>需要访问您的相册来保存媒体文件</string>
    

  • Android：在AndroidManifest.xml中添加对应权限（Android 13+需使用细粒度权限）

    <uses-permission android:name="android.permission.READ_EXTERNAL_STORAGE" />
    <uses-permission android:name="android.permission.WRITE_EXTERNAL_STORAGE" />
    <!-- Android 13+ 适配 -->
    <uses-permission android:name="android.permission.READ_MEDIA_IMAGES" />
    <uses-permission android:name="android.permission.READ_MEDIA_VIDEO" />
    

• 确保库已完成初始化
  避免在App启动初期直接调用MediaType，可在组件生命周期中延迟执行：

  import { useEffect } from 'react';
  import MediaLibrary from 'react-native-media-library';
  
  useEffect(() => {
    const initMediaLibrary = async () => {
      try {
        const photoType = MediaLibrary.MediaType.photo;
        // 后续业务逻辑
      } catch (err) {
        console.error(err);
      }
    };
    initMediaLibrary();
  }, []);
  

• 检查版本兼容性
  确认react-native-media-library版本与你的React Native版本匹配，部分新版本可能仅支持RN 0.68+。可执行 npm show react-native-media-library versions 查看所有版本，选择适配的版本重新安装。

• 清理构建缓存

  • iOS：删除ios/Pods文件夹，重新执行pod install，再通过Xcode执行Command+Shift+K清理缓存后重新构建
  • Android：删除android/app/build文件夹，执行./gradlew clean后重新构建项目

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