在啟動React Native Activity時如何發送數據？

Question

我想在啟動時發送數據以響應本機活動，我在Android活動MainActivity擁有RecyclerView該活動顯示訂單列表，在項目單擊上，我想在reactNative活動中打開該訂單的詳細視圖。 但是我無法發送數據，因為我在每個活動生命周期回調中都將ReactContext為null 。

啟動React活動如下：

    @Override
    public void onItemClick(Order order) {
    Intent intent = new Intent(MainActivity.this, ReactNativeActivity.class);
    intent.putExtra("order",order);
    startActivityForResult(intent, 9);
    }

ReactVativeActivity：

public class ReactNativeActivity extends ReactActivity {

private Order order;

@Override
protected void onCreate(Bundle savedInstanceState) {
    super.onCreate(savedInstanceState);
    order = (Order) getIntent().getSerializableExtra("order");

    WritableMap map = new WritableNativeMap();
    map.putBoolean("complete", order.isCompleted());
    map.putString("id", order.getId());
    //Here I am getting null reactcontext
    sendEvent(getReactInstanceManager().getCurrentReactContext(), "order", map);

}

private void sendEvent(ReactContext reactContext,
                       String eventName,
                       WritableMap params) {
    reactContext
            .getJSModule(DeviceEventManagerModule.RCTDeviceEventEmitter.class)
            .emit(eventName, params);
}

public Order getOrder() {
    return order;
}


@Override
protected String getMainComponentName() {
    return "JioAssignment";
}

public void setResult(boolean isCompleted, String id) {
    Intent intent = new Intent();
    intent.putExtra("completed", isCompleted);
    intent.putExtra("id", id);
    setResult(9, intent);
    finish();
}
}

ApplicationClass：

public class MainApplication extends Application implements ReactApplication {

private CustomReactPackage mCustomPackage;
private final ReactNativeHost mReactNativeHost = new ReactNativeHost(this) {
    @Override
    public boolean getUseDeveloperSupport() {
        return BuildConfig.DEBUG;
    }

    @Override
    protected List<ReactPackage> getPackages() {
        mCustomPackage =  new CustomReactPackage();
        return Arrays.<ReactPackage>asList(
                new MainReactPackage(), mCustomPackage

        );
    }

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

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

public CustomReactPackage getmCustomPackage() {
    return mCustomPackage;
}

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

CustomePackage：

public class CustomReactPackage implements ReactPackage {

private Bridge mBridge;
private ReactApplicationContext reactContext;

@Override
public List<NativeModule> createNativeModules(ReactApplicationContext reactContext) {
    List<NativeModule> modules = new ArrayList<>();
    this.reactContext = reactContext;
    mBridge = new Bridge(reactContext);

    modules.add(mBridge);
    return modules;

}

public Bridge getmBridge() {
    return mBridge;
}

public ReactApplicationContext getReactContext() {
    return reactContext;
}

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

ReactContextBaseJavaModule：

public class Bridge extends ReactContextBaseJavaModule {
private Order order;

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

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

@Nullable
@Override
public Map<String, Object> getConstants() {

    Map<String, Object> vmap = new HashMap<>();
    vmap.put("completed", ((ReactNativeActivity) getCurrentActivity()).getOrder().isCompleted());
    vmap.put("id", ((ReactNativeActivity) getCurrentActivity()).getOrder().getId());
    return vmap;
}

private void sendEvent(
                       String eventName,
                       WritableMap params) {
    getReactApplicationContext()
            .getJSModule(DeviceEventManagerModule.RCTDeviceEventEmitter.class)
            .emit(eventName, params);
}

@ReactMethod
public void updateOrder(boolean isCompleted, String id) {
    ((ReactNativeActivity) getCurrentActivity()).setResult(isCompleted, id);
    Log.w("update", id);
}


}

我看了幾個例子，但沒有找到任何可行的例子。 請幫忙。

Answer 1

React native從托管ReactContext的活動中接受道具。 創建一個ReactActivityDelegate並將其分配到您的ReactActivity中。

public class ReactNativeActivityDelegate extends ReactActivityDelegate {
    private Bundle initialProps = null;
    private Activity activity;

    public ReactNativeActivityDelegate(Activity activity, @Nullable String mainComponentName) {
        super(activity, mainComponentName);
        this.activity = activity;
    }

    @Override
    protected void onCreate(Bundle savedInstanceState) {
        if(activity != null) {
            Bundle bundle = activity.getIntent().getExtras();
            if(bundle != null) {
                initialProps = bundle;
            }
        }
        super.onCreate(savedInstanceState);
    }

    @Nullable
    @Override
    protected Bundle getLaunchOptions() {
        return initialProps;
    }
}

這樣分配反應活動

public class ReactNativeBaseActivity extends ReactActivity {

    @Override
    protected String getMainComponentName() {
        return ReactNativeActivityDelegate.REACT_NATIVE_COMPONENT_NAME;
    }

    @Override
    protected ReactActivityDelegate createReactActivityDelegate() {
        return new ReactNativeActivityDelegate(this, getMainComponentName());
    }
}

像往常一樣將捆綁包傳遞到活動中。 通過的包將在ReactNative道具中訪問。 這段代碼已經投入生產，我們在下面使用它。

String initialRoute = aOrBView() ? 
ReactNativeActivityDelegate.INITIAL_ROUTE_A_VIEW : 
ReactNativeActivityDelegate.INITIAL_ROUTE_B_VIEW;

nextIntent.putExtra(ReactNativeActivityDelegate.EXTRA_INITIAL_ROUTE, initialRoute);
startActivity(nextIntent);

然后我們像這樣在ReactNative中使用它...

let initialRouteId = this.props.initialRoute && 
this.props.initialRoute.length > 0 ? this.props.initialRoute : 'DefaultRoute'
    return (
      <Navigator ....

希望對您有所幫助。