ReactNative 跳转原生页面

Android 原生代码

• 1、新建LiveActivity

public class LiveActivity extends Activity{
  @Override
    protected void onCreate(Bundle savedInstanceState) {
        super.onCreate(savedInstanceState);
        //... activity 代码
}

• 2、新建module

public class LiveModule extends ReactContextBaseJavaModule{
    public LiveModule(ReactApplicationContext reactContext) {
        super(reactContext);
    }

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

    @ReactMethod
    public void startLive(ReadableMap params){
        Intent intent = new Intent(getCurrentActivity(), LiveActivity.class);
        //解析params参数
        getCurrentActivity().startActivity(intent);
    }
}

• 3、新建package

  public class LivePackage implements ReactPackage{
    @Override
    public List createNativeModules(ReactApplicationContext reactContext) {
        return Arrays.asList(new LiveModule(reactContext));
    }

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

• 3、在application中添加package

public class MainApplication extends MultiDexApplication implements ReactApplication {

    private final ReactNativeHost mReactNativeHost = new ReactNativeHost(this) {

        @Override
        protected String getJSBundleFile() {
            return CodePush.getJSBundleFile();
        }

        @Override
        public boolean getUseDeveloperSupport() {
            return BuildConfig.DEBUG;
        }

        @Override
        protected List getPackages() {
            return Arrays.asList(
                    new MainReactPackage(),
                    new LivePackage()
            );
        }

        @Override
        protected String getJSMainModuleName() {
            return "index";
        }
    };

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

    @Override
    public void onCreate() {
        super.onCreate();
        SoLoader.init(this, /* native exopackage */ false);
    }
}

iOS 原生代码

• 1、新建LiveController
  -LiveController.h

#import 

@interface LiveController : UIViewController

@end

-LiveController.m

#import "LiveController.h"

@interface LiveController ()

@end

@implementation LiveController

- (void)viewDidLoad {
    [super viewDidLoad];
    self.navigationItem.title = @"LiveController";
    self.view.backgroundColor = [UIColor whiteColor];
    // Do any additional setup after loading the view.
}

- (void)didReceiveMemoryWarning {
    [super didReceiveMemoryWarning];
    // Dispose of any resources that can be recreated.
}

/*
#pragma mark - Navigation

// In a storyboard-based application, you will often want to do a little preparation before navigation
- (void)prepareForSegue:(UIStoryboardSegue *)segue sender:(id)sender {
    // Get the new view controller using [segue destinationViewController].
    // Pass the selected object to the new view controller.
}
*/

@end

• 2、新建LiveModule.h

#import 

@interface LiveModule : NSObject

@end

• 3、新建LiveModule.m

#import "LiveModule.h"
@implementation LiveModule
  RCT_EXPORT_MODULE();
  RCT_EXPORT_METHOD(startLive:(NSDictionary *)params)
  {
    //务必在主线程中执行跳转操作
    dispatch_async(dispatch_get_main_queue(), ^{
      LiveController *liveController = [[LiveController alloc]init];
      
      AppDelegate *app = (AppDelegate *)[[UIApplication sharedApplication] delegate];
      
      [app.window.rootViewController presentViewController:liveController animated:true completion:nil];
    });
  }
@end

JS代码

• 1、新建LiveUtils

'use strict';
import React from 'react';
import {
    NativeModules
} from 'react-native';
const LiveModule = NativeModules.LiveModule;
class LiveUtils{
    startLive(params){
        LiveModule.startLive(params);
    }
}
const Instance = new LiveUtils();
export default Instance;

• 2、需要跳转时调用

LiveUtils.startLive({a:1,b:2});