react-native-camera使用注意事项

最新推荐文章于 2025-07-25 16:25:51 发布

原创最新推荐文章于 2025-07-25 16:25:51 发布 · 1.3k 阅读

0 ·

CC 4.0 BY-SA版权

React-native 专栏收录该内容

29 篇文章

订阅专栏

本文介绍了如何在React-Native项目中使用react-native-camera组件，并详细阐述了在Android 6.0及以上版本手动申请相机权限的步骤，包括在XML中配置权限以及在组件中设置权限选项。同时，提到了苹果iOS平台申请相机权限的方法，需在Xcode中修改项目设置。正确配置权限是避免使用相机功能时应用闪退的关键。

摘要生成于 C知道，由 DeepSeek-R1 满血版支持，前往体验 >

react-native-camera的地址：https://github.com/react-native-camera/react-native-camera/blob/master/docs/RNCamera.md

Android 6.0以上需要自己手动申请权限

Android申请权限方式参考官方说明：

<RNCamera
          ref={ref => {
            this.camera = ref;
          }}
          style={styles.preview}
          type={RNCamera.Constants.Type.back}
          flashMode={RNCamera.Constants.FlashMode.on}
          androidCameraPermissionOptions={{
            title: 'Permission to use camera',
            message: 'We need your permission to use your camera',
            buttonPositive: 'Ok',
            buttonNegative: 'Cancel',
          }}
          androidRecordAudioPermissionOptions={{
            title: 'Permission to use audio recording',
            message: 'We need your permission to use your audio',
            buttonPositive: 'Ok',
            buttonNegative: 'Cancel',
          }}
          onGoogleVisionBarcodesDetected={({ barcodes }) => {
            console.log(barcodes);
          }}
        />

苹果也需要申请权限：

苹果申请相机权限的操作为：打开ios下的.xcodeproj文件，使用Xcode打开项目，然后选择target，选择info，找到Privacy-Camera Usage Description， Type自动为String，value就自己填写就行

如果不配置相机权限，那么使用react-native-camera进行拍照或者扫码的时候会闪退