React Native 携手原生 iOS/Android 轻松获取 APP 版本号

2024-01-28 19:25:49

从 React Native 到 iOS
在 iOS 中，我们需要创建一个继承自 RCTBridgeModule 的类，负责处理通信。下面是代码示例：

#import <React/RCTBridgeModule.h>

@interface RCTMyAppModule : NSObject <RCTBridgeModule>
@end

@implementation RCTMyAppModule

RCT_EXPORT_MODULE();

RCT_EXPORT_METHOD(getAppVersion:(RCTPromiseResolveBlock)resolve
                  rejecter:(RCTPromiseRejectBlock)reject)
{
  NSString *version = [[NSBundle mainBundle] infoDictionary][@"CFBundleShortVersionString"];
  resolve(version);
}

@end

为了使用此模块，需要在 AppDelegate.m 中进行注册：

- (BOOL)application:(UIApplication *)application didFinishLaunchingWithOptions:(NSDictionary *)launchOptions
{
  RCTBridge *bridge = [[RCTBridge alloc] initWithDelegate:self launchOptions:launchOptions];
  RCTRootView *rootView = [[RCTRootView alloc] initWithBridge:bridge moduleName:@"RCTMyApp" initialProperties:nil];
  self.window.rootViewController = [[UIViewController alloc] initWithNibName:nil bundle:nil];
  self.window.rootViewController.view = rootView;
  [self.window makeKeyAndVisible];
  return YES;
}

- (NSArray<id<RCTBridgeModule>> *)extraModulesForBridge:(RCTBridge *)bridge
{
  return @[[RCTMyAppModule new]];
}

最后，在 React Native 代码中，我们就可以调用此方法了：

import { NativeModules } from 'react-native';

const { RCTMyAppModule } = NativeModules;

RCTMyAppModule.getAppVersion().then(version => {
  console.log(`APP 版本号：${version}`);
});

2. 从 React Native 到 Android

在 Android 中，我们需要创建一个 Java 类，实现 ReactContextBaseJavaModule 和 Promise 接口。代码示例如下：

import com.facebook.react.bridge.Promise;
import com.facebook.react.bridge.ReactApplicationContext;
import com.facebook.react.bridge.ReactContextBaseJavaModule;
import com.facebook.react.bridge.ReactMethod;

public class RCTMyAppModule extends ReactContextBaseJavaModule {

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

  @Override
  public String getName() {
    return "RCTMyAppModule";
  }

  @ReactMethod
  public void getAppVersion(Promise promise) {
    String version = BuildConfig.VERSION_NAME;
    promise.resolve(version);
  }
}

为了使用此模块，需要在 MainApplication.java 中进行注册：

public class MainApplication extends Application implements ReactApplication {

  private final ReactNativeHost mReactNativeHost = new ReactNativeHost(this) {
    @Override
    protected List<ReactPackage> getPackages() {
      return Arrays.<ReactPackage>asList(
        new MainReactPackage(),
        new RCTMyAppPackage()
      );
    }
  };

  @Override
  public ReactNativeHost getReactNativeHost() {
    return mReactNativeHost;
  }
}

最后，在 React Native 代码中，我们也可以调用此方法了：

import { NativeModules } from 'react-native';

const { RCTMyAppModule } = NativeModules;

RCTMyAppModule.getAppVersion().then(version => {
  console.log(`APP 版本号：${version}`);
});