Android现有项目集成RN：Activity间POJO传入RN JS代码实现方法

我刚好在项目里做过类似的React Native嵌入现有Android应用的需求，给你分享几个实用的方法，把POJO数据传到JS代码里：

这是最直接的方式，适合在RN组件初始化时就需要用到POJO数据的场景。核心是把POJO转成RN能识别的键值对结构，在创建ReactRootView时传入。

Android端代码（Activity B中） #

// 1. 先把你的POJO对象转成RN支持的HashMap
HashMap<String, Object> pojoParams = new HashMap<>();
pojoParams.put("id", yourPojo.getId());
pojoParams.put("userName", yourPojo.getUserName());
pojoParams.put("isActive", yourPojo.isActive());
// 嵌套字段可以继续转成HashMap嵌套进去

// 2. 创建ReactRootView并设置初始属性
ReactRootView rootView = new ReactRootView(this);
rootView.setInitialProperties(pojoParams);

// 3. 初始化ReactInstanceManager并关联rootView
ReactInstanceManager reactInstanceManager = ReactInstanceManager.builder()
        .setApplication(getApplication())
        .setCurrentActivity(this)
        .setBundleAssetName("index.android.bundle")
        .setJSMainModulePath("index")
        .addPackage(new MainReactPackage())
        .build();

// 4. 启动RN应用，把参数传进去
rootView.startReactApplication(reactInstanceManager, "YourRNComponent", pojoParams);

// 最后把rootView添加到Activity B的布局容器中
LinearLayout container = findViewById(R.id.rn_container);
container.addView(rootView);

React Native端代码 #

const YourRNComponent = (props) => {
  // 直接通过props拿到传递过来的POJO数据
  console.log('Received POJO:', props);
  
  return (
    <View style={{padding: 16}}>
      <Text>用户ID: {props.id}</Text>
      <Text>用户名: {props.userName}</Text>
      <Text>状态: {props.isActive ? '活跃' : '禁用'}</Text>
    </View>
  );
};

export default YourRNComponent;

如果POJO数据是在RN初始化完成后才需要传递，或者后续有更新需求，可以用这种方式主动给JS发送事件。

Android端代码（Activity B中） #

// 给ReactInstanceManager添加初始化监听
reactInstanceManager.addReactInstanceEventListener(new ReactInstanceManager.ReactInstanceEventListener() {
    @Override
    public void onReactContextInitialized(ReactContext reactContext) {
        // 把POJO转成RN的WritableMap
        WritableMap params = Arguments.createMap();
        params.putInt("id", yourPojo.getId());
        params.putString("userName", yourPojo.getUserName());
        
        // 发送自定义事件到JS
        reactContext.getJSModule(DeviceEventManagerModule.RCTDeviceEventEmitter.class)
                .emit("onPojoDataReceived", params);
    }
});

React Native端代码 #

import { NativeEventEmitter, NativeModules, View, Text, useState, useEffect } from 'react-native';

const eventEmitter = new NativeEventEmitter(NativeModules.DeviceEventManagerModule);

const YourRNComponent = () => {
  const [pojoData, setPojoData] = useState(null);

  useEffect(() => {
    // 监听原生发送的事件
    const subscription = eventEmitter.addListener(
      'onPojoDataReceived',
      (data) => {
        setPojoData(data);
        console.log('Received via event:', data);
      }
    );

    // 组件卸载时移除监听
    return () => subscription.remove();
  }, []);

  if (!pojoData) return null;

  return (
    <View style={{padding: 16}}>
      <Text>用户名: {pojoData.userName}</Text>
    </View>
  );
};

export default YourRNComponent;

如果需要JS主动触发获取POJO数据的操作，可以写一个自定义原生模块，提供给JS调用的方法。

Android端：创建自定义模块 #

public class PojoDataModule extends ReactContextBaseJavaModule {
    private final YourPOJO yourPojo;

    public PojoDataModule(ReactApplicationContext reactContext, YourPOJO pojo) {
        super(reactContext);
        this.yourPojo = pojo;
    }

    // 模块名称，JS中通过这个名称调用
    @Override
    public String getName() {
        return "PojoDataModule";
    }

    // 暴露给JS的异步方法，用Promise返回数据
    @ReactMethod
    public void getPojoData(Promise promise) {
        WritableMap dataMap = Arguments.createMap();
        dataMap.putInt("id", yourPojo.getId());
        dataMap.putString("userName", yourPojo.getUserName());
        promise.resolve(dataMap);
    }
}

Android端：注册自定义模块 #

public class CustomReactPackage implements ReactPackage {
    private final YourPOJO pojo;

    public CustomReactPackage(YourPOJO pojo) {
        this.pojo = pojo;
    }

    @Override
    public List<NativeModule> createNativeModules(ReactApplicationContext reactContext) {
        List<NativeModule> modules = new ArrayList<>();
        modules.add(new PojoDataModule(reactContext, pojo));
        return modules;
    }

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

Android端：在Activity B中添加自定义Package #

ReactInstanceManager reactInstanceManager = ReactInstanceManager.builder()
        // ...其他配置
        .addPackage(new MainReactPackage())
        .addPackage(new CustomReactPackage(yourPojo)) // 加入自定义Package
        .build();

React Native端代码 #

import { NativeModules, View, Text, useState, useEffect } from 'react-native';

const { PojoDataModule } = NativeModules;

const YourRNComponent = () => {
  const [pojoData, setPojoData] = useState(null);

  useEffect(() => {
    // 主动调用原生方法获取数据
    const fetchData = async () => {
      try {
        const data = await PojoDataModule.getPojoData();
        setPojoData(data);
      } catch (error) {
        console.error('Failed to fetch POJO:', error);
      }
    };

    fetchData();
  }, []);

  if (!pojoData) return <Text>Loading...</Text>;

  return (
    <View style={{padding: 16}}>
      <Text>用户ID: {pojoData.id}</Text>
    </View>
  );
};

export default YourRNComponent;

注意：不管用哪种方法，都不能直接传递POJO对象，必须先转换成RN支持的可序列化类型（如HashMap或WritableMap），字段类型要对应JS的基础类型（字符串、数字、布尔值等），嵌套对象需要逐层转换。

内容的提问来源于stack exchange，提问作者Rahul