ReactNative入門之android與rn初始化參數的傳遞
阿新 • • 發佈:2018-10-14
具體實現 如何 code ready instance manage com 返回值 自定義 1、基本理念
3、參數傳遞的原理及實現
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() {
Bundle bundle = new Bundle();
bundle.putString("bundle","android傳遞的初始化參數");
return bundle;
}
}
}
4、在ReactView中使用參數
在React Native 代碼的render方法中使用傳入的參數:
render() {
var initProps = this.props.bundle;
return( <Text style={styles.text_hello}{initProps}</Text>);
}
結束
本文整理自:
ReactNative入門之android與rn初始化參數的傳遞
原作寫的很好~~~ 我這裏只是整理,便於以後學習參考。
ReactNative入門之android與rn初始化參數的傳遞