ReactNative入门之android与rn初始化参数的传递
RN APP本质上也是原生APP,只是在原生APP中加入了React Native视图的支持。
因此获取RN APP的启动参数的方法原生APP是一样的,获取启动参数后再通过合适的方法传递给RN视图。
如何获得启动参数,不要再搜索RN如何获得启动参数,直接参考原生APP获得启动参数的文章。
可以参考这个例子:
ndroid中一个APP启动另一个APP并传递参数
本文重点说明如何将启动参数传递给React Native代码。
2、ReactNative的Ativity继承关系 MainActivity --> ReactActivity --> Activity
3、参数传递的原理及实现
下面重点介绍如何将获取的启动参数传递给RN视图。
重点阅读 ReactActivity 类中的如下代码:
public abstract class ReactActivity extends Activity implements DefaultHardwareBackBtnHandler, PermissionAwareActivity { //定义私有变量mDelegate private final ReactActivityDelegate mDelegate; //在构造函数中创建mDelegate protected ReactActivity() { mDelegate = createReactActivityDelegate(); } //创建mDelegate的方法,这里注释很清楚,可以重写该方法并自定义delegate /** * Called at construction time, override if you have a custom delegate implementation. */ protected ReactActivityDelegate createReactActivityDelegate() { return new ReactActivityDelegate(this, getMainComponentName()); } //关键的地方,mDelegate.loadApp创建了React Native视图,并传入参数。 //具体见mDelegate.loadApp的代码。 protected final void loadApp(String appKey) { mDelegate.loadApp(appKey); } }
loadApp方法所调用的mDelegate.loadApp 方法,是创建React 视图并传入参数的核心代码所在:
public class ReactActivityDelegate { //.... protected void loadApp(String appKey) { if (mReactRootView != null) { throw new IllegalStateException("Cannot loadApp while app is already running."); } mReactRootView = createRootView(); mReactRootView.startReactApplication( getReactNativeHost().getReactInstanceManager(), appKey, getLaunchOptions()); getPlainActivity().setContentView(mReactRootView); } //.... } }
注意: startReactApplication函数的最后一个参数getLaunchOptions()返回值是传给ReactView的参数,我们要在这里把启动参数传入。看看getLaunchOptions()的实现:
protected @Nullable Bundle getLaunchOptions() { return null; }
什么也没返回,这简直太好了,我们只要在这里把我们的初始化参数给他就行了。
以上都是基础原理的准备,如果觉得有些晦涩,直接看如下的具体实现代码就可以了。
public class MainActivity extends ReactActivity { //重写这个方法,返回自定义的delegate. @Override protected ReactActivityDelegate createReactActivityDelegate() { return new MyReactDelegate(this,getMainComponentName()); } //自定义MyReactDelegate class MyReactDelegate extends ReactActivityDelegate { public MyReactDelegate(Activity activity, @javax.annotation.Nullable String mainComponentName) { super(activity, mainComponentName); } //重点是重写这个方法,把启动参数在这里准备好。 @javax.annotation.Nullable @Override protected Bundle getLaunchOptions() { //获取传入的参数 Intent intent = getIntent(); String data_str = intent.getStringExtra("data"); Bundle bundle = new Bundle(); //bundle.putString("bundle","android传递的初始化参数"); bundle.putString("data",data_str); return bundle; } } }
4、在ReactView中使用参数
在React Native 代码的render方法中使用传入的参数:
render() { var initProps = this.props.bundle; return( <Text style={styles.text_hello}{initProps}</Text>); }
结束
本文整理自:
ReactNative入门之android与rn初始化参数的传递
原作写的很好~~~ 我这里只是整理,便于以后学习参考。
声明:本站所有文章资源内容,如无特殊说明或标注,均为采集网络资源。如若本站内容侵犯了原著者的合法权益,可联系本站删除。