react-native獲取設備信息組件（react-native-device-info）

轉載鏈接:http://www.ncloud.hk/%E6%8A%80%E6%9C%AF%E5%88%86%E4%BA%AB/react-native-acquisition-device-information-component-react-native-device-info/

一、組件說明：

該組件同時適配Android和IOS平臺。

二、組件介紹

1.首先需要安裝組件:npm install react-native-device-info --save

2.IOS初始化:打開Xcode——>右擊Libraries——>選擇文件到當前項目，進入到node_modules/react-native-device-info——>添加.xcodeproj文件

2.1.在Xcode中點擊你的工程名字——>Build Phases——>Link Binary With Libraries——>點擊 '+'號按鈕，添加libRNDeviceInfo.a文件(如下圖所示)

2.2.添加環境變量:$(SRCROOT)/../react-native/React and $(SRCROOT)/../../React 並且修改 recursive

2.3.好了，下面就是基本的用法了

import DeviceInfo from 'react-native-device-info'
console.log("Device Unique ID", DeviceInfo.getUniqueID());  // e.g. FCDBD8EF-62FC-4ECB-B2F5-92C9E79AC7F9
// * note this is IDFV on iOS so it will change if all apps from the current apps vendor have been previously uninstalled

console.log("Device Manufacturer", DeviceInfo.getManufacturer());  // e.g. Apple

console.log("Device Model", DeviceInfo.getModel());  // e.g. iPhone 6

console.log("Device ID", DeviceInfo.getDeviceId());  // e.g. iPhone7,2 / or the board on Android e.g. goldfish

console.log("Device Name", DeviceInfo.getSystemName());  // e.g. iPhone OS

console.log("Device Version", DeviceInfo.getSystemVersion());  // e.g. 9.0

console.log("Bundle Id", DeviceInfo.getBundleId());  // e.g. com.learnium.mobile

console.log("Build Number", DeviceInfo.getBuildNumber());  // e.g. 89

console.log("App Version", DeviceInfo.getVersion());  // e.g. 1.1.0

console.log("App Version (Readable)", DeviceInfo.getReadableVersion());  // e.g. 1.1.0.89

console.log("Device Name", DeviceInfo.getDeviceName());  // e.g. Becca's iPhone 6

console.log("User Agent", DeviceInfo.getUserAgent()); // e.g. Dalvik/2.1.0 (Linux; U; Android 5.1; Google Nexus 4 - 5.1.0 - API 22 - 768x1280 Build/LMY47D)

console.log("Device Locale", DeviceInfo.getDeviceLocale()); // e.g en-US

console.log("Device Country", DeviceInfo.getDeviceCountry()); // e.g US

3.Android的安裝：

3.1首先需要修改下Gradle文件

在你的根目錄下運行:react-native link react-native-device-info

3.2在MainActivity.java文件中進行註冊模塊(react-native的版本需要>0.18)

import com.learnium.RNDeviceInfo.RNDeviceInfo;  // <--- import

public class MainActivity extends ReactActivity {
  ......

  /**
   * A list of packages used by the app. If the app uses additional views
   * or modules besides the default ones, add more packages here.
   */
    @Override
    protected List<ReactPackage> getPackages() {
      return Arrays.<ReactPackage>asList(
        new RNDeviceInfo(), // <------ add here
        new MainReactPackage());
    }
}

3.3如果你需要在安卓上獲取設備的名字，需要修改AndroidManifest.xml配置文件，來獲取權限。

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

3.4用法同IOS。

翻譯鏈接:https://github.com/rebeccahughes/react-native-device-info