React Native 中如何使用第三方权限库（如 react-native-permissions）？-JavaScript中文网-JavaScript教程资源分享门户

推荐答案

在 React Native 中使用 react-native-permissions 库来管理权限的步骤如下：

安装库：首先，使用 npm 或 yarn 安装 react-native-permissions 库。

npm install react-native-permissions
# 或者
yarn add react-native-permissions

链接库：对于 React Native 0.60 及以上版本，库会自动链接。对于旧版本，需要手动链接：
```
react-native link react-native-permissions
```

配置权限：在 AndroidManifest.xml 和 Info.plist 文件中添加所需的权限声明。

Android (AndroidManifest.xml)：

<uses-permission android:name="android.permission.CAMERA" />

iOS (Info.plist)：

<key>NSCameraUsageDescription</key>
<string>我们需要访问您的相机以拍摄照片。</string>

请求权限：在代码中使用 react-native-permissions 请求权限。

// www.javascriptcn.com code example
import { PermissionsAndroid, Platform } from 'react-native';
import { check, request, PERMISSIONS, RESULTS } from 'react-native-permissions';

const requestCameraPermission = async () => {
  if (Platform.OS === 'android') {
    const granted = await PermissionsAndroid.request(
      PermissionsAndroid.PERMISSIONS.CAMERA,
      {
        title: '相机权限',
        message: '我们需要访问您的相机以拍摄照片。',
        buttonNeutral: '稍后询问',
        buttonNegative: '取消',
        buttonPositive: '确定',
      }
    );
    if (granted === PermissionsAndroid.RESULTS.GRANTED) {
      console.log('相机权限已授予');
    } else {
      console.log('相机权限被拒绝');
    }
  } else if (Platform.OS === 'ios') {
    const result = await check(PERMISSIONS.IOS.CAMERA);
    if (result === RESULTS.GRANTED) {
      console.log('相机权限已授予');
    } else {
      const requestResult = await request(PERMISSIONS.IOS.CAMERA);
      if (requestResult === RESULTS.GRANTED) {
        console.log('相机权限已授予');
      } else {
        console.log('相机权限被拒绝');
      }
    }
  }
};

requestCameraPermission();

本题详细解读

1. 安装与链接

react-native-permissions 是一个用于管理 React Native 应用权限的库。它支持 Android 和 iOS 平台，并且提供了统一的 API 来请求和检查权限。安装后，库会自动链接到项目中，但如果你使用的是旧版本的 React Native，可能需要手动链接。

2. 配置权限

在 Android 和 iOS 平台上，权限需要在各自的配置文件中声明。对于 Android，权限声明在 AndroidManifest.xml 文件中；对于 iOS，权限声明在 Info.plist 文件中。这些声明是必需的，否则应用将无法请求相应的权限。

3. 请求权限

在代码中，你可以使用 check 和 request 方法来检查和请求权限。check 方法用于检查当前权限状态，而 request 方法用于请求权限。根据平台的不同，权限的请求方式也有所不同。在 Android 上，你可以使用 PermissionsAndroid API 来请求权限；在 iOS 上，你可以直接使用 react-native-permissions 提供的 API。

4. 处理权限结果

请求权限后，你需要处理权限的结果。如果权限被授予，你可以继续执行相关操作；如果权限被拒绝，你可能需要提示用户或采取其他措施。