React-Native 獲取設備信息, Android獲取IEMI碼

簡單介紹

獲取設備信息, 使用的是 react-native-device-info
獲取IMEI碼參考了react-native-imei源碼

關于引入上面的依賴, 鏈接中都有說明,
算了還是說一遍吧:

**注意: ** 這里只說 Android 的配置步驟, IOS請去鏈接中查看

1: 獲取設備信息 react-native-device-info (不包括IMEI)
  • 1: 安裝依賴:
npm install --save react-native-device-info 
  • 2: 配置文件:
    • 1:在文件 android/app/build.gradle:
      dependencies {
        ...
           compile "com.facebook.react:react-native:+"  // From node_modules
         +   compile project(':react-native-device-info')
      

    }

    - 2: 在文件 `in android/settings.gradle:`
    
    ...
    include ':app'
    + include ':react-native-device-info'
    
    • project(':react-native-device-info').projectDir = new File(rootProject.projectDir, '../node_modules/react-native-device-info/android')
    - 3: 在文件 `android/app/src/main/java/com/XXX(項目名稱)/MainApplication.java:`
    
      + import com.learnium.RNDeviceInfo.RNDeviceInfo;
    
      public class MainApplication extends Application implements ReactApplication {
      //......
    
      @Override
      protected List<ReactPackage> getPackages() {
        return Arrays.<ReactPackage>asList(
    
    •     new RNDeviceInfo(),
          new MainReactPackage()
      );
      
      }

    ......
    }

    
    - 4: 如果你想獲取設備的名字: 在 文件: `android/app/src/main/AndroidManifest.xml`
    
    ...
    <uses-permission android:name="android.permission.BLUETOOTH"/>
    
    
    
    
  • 3: 配置完成,運行

1: 從新 react-native run-android 你的項目, 也許會有點慢,
如果報錯為: can not deleted ............., 請重新運行幾次 react-native run-android

  • 4: 使用方法:
var DeviceInfo = require('react-native-device-info');
</Text>: {DeviceInfo.getUniqueID()} </Text>
</Text> :{DeviceInfo.getInstanceID()}</Text>

其他方法見 react-native-device-info

獲取后的設備信息
2: react-native-imei 獲取手機IMEI碼
  • 1: 安裝依賴:
     npm install --save react-native-imei
    
  • 2: 配置文件
    • 在文件 android/app/src/main/AndroidManifest.xml
      <uses-permission android:name="android.permission.READ_PHONE_STATE"/>
    
  • 3: 自動配置:
      react-native link react-native-imei
    
  • 4: 使用:
import { NativeModules, Text, View,} from 'react-native';

export default class TestDeviceInfo extends Component {
  constructor(props) {
    super(props);
    this.state = {
      IMEI: '未獲取',
    }
  }

  // 由于是異步獲取 , 這里使用 async  ... await更改為同步, 不然獲取始終為underfind
  async getIMEI() {
    let IMEI =  await NativeModules.IMEI.getIMEI()
    this.setState({
      IMEI: IMEI,
    })
  }

  componentDidMount() {
    this.getIMEI()
  }
  render() {
      return (
        <View>
              <Text style={styles.instructions}>
                <Text style={{color: '#0366d6'}}> 'IMEI(IMEI碼)'</Text>: {this.state.IMEI}
              </Text>
        </View>
      );
    }
}
最后編輯于
?著作權歸作者所有,轉載或內容合作請聯系作者
平臺聲明:文章內容(如有圖片或視頻亦包括在內)由作者上傳并發布,文章內容僅代表作者本人觀點,簡書系信息發布平臺,僅提供信息存儲服務。

推薦閱讀更多精彩內容