在使用react-native混合开发，经常会遇到一种场景：当原生页面的数据更新，返回RN的页面，一下相关数据并未刷新。这里就需要一个转发机制，然后原生应用通过事件的形式通知react-native更新数据，最新版的react-native文档中并未说明，下面讲解一下如何实现：

Android通讯

React-Native代码 ： 

import { DeviceEventEmitter , Platform } from 'react-native';
componentWillMount(){//页面被渲染之前执行
     if(Platform.OS=='android'){
           DeviceEventEmitter.addListener('EventRefresh', (obj)=>{//android监听事件EventRefresh,
                this._getData();
            });
    }
}

Android代码：

WritableMap params = Arguments.createMap();  
params.putString("message",msg.obj.toString());  
reactContext.getJSModule(DeviceEventManagerModule.RCTDeviceEventEmitter.class).emit('EventRefresh', params);//名称，数据

IOS通讯

React-Native代码 ： 

import { NativeEventEmitter , Platform } from 'react-native';
componentDidMount(){//组件加载完毕执行
        try{
            if(Platform.OS=='ios'){
                const navigationEmitter = new NativeEventEmitter(Global.kmrn.service);
                this._refresh=navigationEmitter.addListener('EventRefresh', (obj) => {//ios监听事件刷新数据
                    this._getData();
                });
            }
        }catch(e){
            console.log("KMRNService错误："+e);
        }    
    }

IOS代码：  

//自定义的模块类头文件要继承自RCTEventEmitter
#import "RCTEventEmitter.h"  
@interface ChivoxISE : RCTEventEmitter<RCTBridgeModule>
//然后要导出你所有的方法名字
- (NSArray<NSString *> *)supportedEvents  
{  
  return @[@"EventRefresh", @"other"];  
} 
//分别实现你导出的所有方法，里面都使用sendEventWithName 方法即可  
-(void)iseCallback:(NSString*)code result:(NSString*) result  
{  
  [self sendEventWithName:@"EventRefresh"  
      body:@{  
            @"code": code,  
           @"result": result,  
      }];  
}

本文内容仅供个人学习/研究/参考使用，不构成任何决策建议或专业指导。分享/转载时请标明原文来源，同时请勿将内容用于商业售卖、虚假宣传等非学习用途哦～感谢您的理解与支持！

链接: https://fly63.com/article/detial/9