React Native獲取app版本號

RN項目名爲hotApp 

1、IOS

在項目的ios > hotApp文件目錄下，增加AppVersion.h、AppVersion.m文件。（IOS原生開發讀取版本的函數）

AppVersion.h

#import <Foundation/Foundation.h>

#import <React/RCTBridgeModule.h>
NS_ASSUME_NONNULL_BEGIN

@interface AppVersion : NSObject<RCTBridgeModule>

@end

NS_ASSUME_NONNULL_END

 AppVersion.m

#import "AppVersion.h"

@implementation AppVersion
@synthesize bridge = _bridge;

RCT_EXPORT_MODULE();

RCT_EXPORT_METHOD(getAppVersion:(RCTResponseSenderBlock)callback)
{
  NSString *version = [[[NSBundle mainBundle] infoDictionary] objectForKey:@"CFBundleShortVersionString"];
  callback(@[[NSNull null],version]);
  
}

@end

2、Android

在項目的android > app > src > main > java >com > hotapp > rn文件目錄下，增加RNReactPackage.java、RNBridgeManager.java文件。（IOS原生開發讀取版本的函數）

RNBridgeManager.java

package com.hotapp.rn; //這兒的hotapp換成目錄下對應的app名字即可,一般爲小寫

import com.facebook.react.bridge.Callback;
import com.facebook.react.bridge.ReactApplicationContext;
import com.facebook.react.bridge.ReactContextBaseJavaModule;
import com.facebook.react.bridge.ReactMethod;
import com.facebook.react.uimanager.IllegalViewOperationException;
import android.content.pm.PackageInfo;
import android.content.pm.PackageManager;

public class RNBridgeManager extends ReactContextBaseJavaModule {

    public RNBridgeManager(ReactApplicationContext reactContext) {
        super(reactContext);
    }

    //重寫getName方法聲明Module類名稱,在RN調用時用到
    @Override
    public String getName() {
        return "BridgeManager";
    }

    //聲明的方法，外界調用
    @ReactMethod
    public void getAppVersion(Callback successCallback) {
        try {
            PackageInfo info = getPackageInfo();
            if(info != null){
                successCallback.invoke(info.versionName);
            }else {
                successCallback.invoke("");
            }
        } catch (IllegalViewOperationException e){

        }
    }

    //獲取 APP 信息
    private PackageInfo getPackageInfo(){
        PackageManager manager = getReactApplicationContext().getPackageManager();
        PackageInfo info = null;
        try{
            info = manager.getPackageInfo(getReactApplicationContext().getPackageName(),0);
            return info;
        }catch (Exception e){
            e.printStackTrace();
        }finally {
            return info;
        }
    }
}

RNReactPackage.java

package com.hotapp.rn;//這兒的hotapp換成目錄下對應的app名字即可,一般爲小寫

import com.facebook.react.ReactPackage;

import com.facebook.react.bridge.NativeModule;
import com.facebook.react.bridge.ReactApplicationContext;
import com.facebook.react.uimanager.ViewManager;
import java.util.ArrayList;
import java.util.Collections;
import java.util.List;
public class RNReactPackage implements ReactPackage {


    @Override
    public List<ViewManager> createViewManagers(ReactApplicationContext reactContext) {
        return Collections.emptyList();
    }

    @Override
    public List<NativeModule> createNativeModules(ReactApplicationContext reactContext) {
        List<NativeModule> modules = new ArrayList<>();

        //添加一個安卓原生的activity模塊
        modules.add(new RNBridgeManager(reactContext));
        return modules;
    }

}

 

在組件裏使用

import { Platform, NativeModules } from 'react-native';
const _appVersion = NativeModules.AppVersion;

class App extends Component{
    
    componentDidMount(){
      if (Platform.OS == 'ios') {
         _appVersion.getAppVersion((e, v) => {
           if (!e) {
             console.log("版本號:"+v)
           }
         })
      }else{
         NativeModules.BridgeManager.getAppVersion((v) => {
            if (v) {
              console.log("版本號:"+v)
            }
         });
      }
    }

    render() {
        return (
          <View>
            <Text>Welcome to React Native!</Text>
          </View>
        )
    }
}

export default App;