ReactNative进阶（二十一）开源插件 react-native-device-info 获取设备信息

用户57923016702
326 阅读2分钟

项目开发过程中，需要获取设备信息，例如获取设备名称。可通过使用开源的第三方组件react-native-device-info，该组件适用于iOS和Android双平台。

在ReactNative项目中可通过npm命令下载 react-native-device-info 组件依赖包：

npm install --save react-native-device-info

二、Android 平台

android需要在AndroidManifest.xml配置文件添加android.permission.BLUETOOTH权限

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

具体应用示例如下，有关更多获取设备属性方法详参 react-native-device-info。

import DeviceInfo from 'react-native-device-info';
DeviceInfo.getDeviceName()

注⚠️：官方文档指出，在调用getDeviceName()方法获取设备名称时，当版本号低于v3时，android需要在AndroidManifest.xml配置文件添加android.permission.BLUETOOTH权限，若版本号不低于v3，android.permission.BLUETOOTH权限可不添加。

DeviceInfo.getDeviceName().then((deviceName) => {
  // iOS: "Becca's iPhone 6"
  // Android: ?
  // Windows: ?
});

This used to require the android.permission.BLUETOOTH but the new implementation in v3 does not need it. You may remove that from your AndroidManifest.xml if you had it for this API. iOS 16 and greater require entitlements to access user-defined device name, otherwise a generic value is returned (ie. ‘iPad’, ‘iPhone’)

三、iOS 平台

其中，针对iOS系统为16或者更高版本，需要设置允许获取用户自定义设备名称权限，否则将获取iOS移动设备通用名称，例如 ‘iPad’, ‘iPhone’。

  1. 首先在xcode中进行初始化。

打开xcode，找到自己的项目->Libraries文件夹，选择Add Files to ‘项目名’，然后找到当前项目目录/node_modules/react-native-device-info文件夹，找到’RNDeviceInfo.xcodeproj’文件，然后点击Add.

在这里插入图片描述
2. 在xcode中加载内库。

找到项目名字 ----> Build Phases —> Link Binary With Libraries, 点击‘+’按钮，添加‘libRNDeviceInfo.a’库。

在这里插入图片描述

  1. 继续添加环境变量

$(SRCROOT)/../react-native/React

$(SRCROOT)/../../React

并修改recursive。

其实前端开发的知识点就那么多，面试问来问去还是那么点东西。所以面试没有其他的诀窍，只看你对这些知识点准备的充分程度。so，出去面试时先看看自己复习到了哪个阶段就好。

这里再分享一个复习的路线：（以下体系的复习资料是我从各路大佬收集整理好的）

《前端开发四大模块核心知识笔记》

最后，说个题外话，我在一线互联网企业工作十余年里，指导过不少同行后辈。帮助很多人得到了学习和成长。

我意识到有很多经验和知识值得分享给大家，也可以通过我们的能力和经验解答大家在IT学习中的很多困惑，所以在工作繁忙的情况下还是坚持各种整理和分享。

开源分享：docs.qq.com/doc/DSmRnRG…

avatar
文章
阅读
粉丝