方式一:原生主动向RN发送数据
第一步:在MainApplication中 添加Package 它实现了ReactApplication接口代码如下:
private final ReactNativeHost mReactNativeHost = new ReactNativeHost(this) {
@Override
protected String getJSBundleFile() {
return CodePush.getJSBundleFile();
}
@Override
protected List<ReactPackage> getPackages() {
return Arrays.<ReactPackage>asList(
new MainReactPackage(),
updateDownloadPackage, //这里以updateDownloadPackage为例子
new RNGestureHandlerPackage(),
new CodePush(getResources().getString(R.string.reactNativeCodePush_androidDeploymentKey), getApplicationContext(), BuildConfig.DEBUG)
);
}
@Override
protected String getJSMainModuleName() {
return "index";
}
@Override
public boolean getUseDeveloperSupport() {
return BuildConfig.DEBUG;
}
};
接下来看看Packager的代码例子
public class UpdateDownloadPackage implements ReactPackage {
@Override
public List<NativeModule> createNativeModules(ReactApplicationContext reactContext) {
List<NativeModule> modules=new ArrayList<>();
modules.add(new UpdateDownloadModule(reactContext));
return modules;
}
@Override
public List<ViewManager> createViewManagers(ReactApplicationContext reactContext) {
return Collections.emptyList();
}
}
接下来的重点还是在Module中,代码如下:
public class UpdateDownloadModule extends ReactContextBaseJavaModule {
public static final String MODULE_NAME="updateDownloadModule";
public static final String EVENT_NAME = "nativeCallRn";
public ReactApplicationContext context ;
public UpdateDownloadModule(ReactApplicationContext reactContext) {
super(reactContext);
this.context = reactContext;
}
@Override
public String getName() {
return MODULE_NAME;
}
//新版RN多了一个initalize方法 ,如果是老版本没有这个方法可以直接在MainActivity中实现
@Override
public void initialize() {
Log.i("gdchent","module_initialize");
nativeCallRn("需要的数据"); //这里可以传json对象
}
@Override
public boolean canOverrideExistingModule() {
return false;
}
@Override
public void onCatalystInstanceDestroy() {
}
/**
* Native调用RN
* @param msg
*/
public void nativeCallRn(String msg) {
Log.i("gdchent","apkUrl"+msg);
context.getJSModule(DeviceEventManagerModule.RCTDeviceEventEmitter.class)
.emit(EVENT_NAME,msg);
}
}
RN端接收数据:
import { DeviceEventEmitter } from 'react-native';
/**
* 接收原生调用
*/
componentDidMount() {
DeviceEventEmitter.addListener('nativeCallRn',(msg)=>{
title = "React Native界面,收到数据:" + global.patchImgNames;
ToastAndroid.show("发送成功", ToastAndroid.SHORT);
})
}
方式2:调用原生代码跳转到原生界面
...详情参见GitHub传送门
https://github.com/gdchent/NavigationApp