react-navtive与原生通讯机制(原生主动发消息调用react-native)

通信无非就是1.react-native通知原生,原生相应回调给rn。2.原生通知rn调用。前面一种相对来说比较简单,资料也很全,这里我就不再介绍了,这里重点说一下第二种,也是我认为比较重要的,自己摸索出来的,资料相对较少。首先我建议大家看一篇这个文章写得还不错。

https://www.jianshu.com/p/9d7dbf17daa5

还有一篇专门讲通讯机制原理的,地址我给忘了?,等找到再分享一下。

好了这篇比较干活,直接上代码iOS,安卓原理都差不多,第二种情景其实用的也比较多。

1.原生接收推送消息,刷新rn页面

2.聊天社交软件用户在其他软件上面登录,这边被迫下线

3.笼统原生底层socket接收数据,要主动刷新rn

 

 

以我之前的项目为例 首先在原生iOS 创建桥接通信的类

NativeEventEmitter

/** * Deprecated - subclass NativeEventEmitter to create granular event modules instead of * adding all event listeners directly to RCTNativeAppEventEmitter. */

你可以理解为是一个监听类,将原生的消息监听,发送到rn上面

RCT_EXPORT_MODULE(); 宏定义导出了模块

supportedEvents方法返回你需要通知的名称,我这里定义了2个,一个是有消息通知rn消息标红,二是用户在其他地方登录,被迫下线。

接下来看一下rn是怎么操作的

 

const { CommonEventEmitter } = NativeModules;

const managerEmitter = new NativeEventEmitter(CommonEventEmitter);

const subscription = managerEmitter.addListener(
  'messageNew',
  (reminder) => console.log(reminder.messageNum)
);

//通常在componentWillUnmount生命周期方法中实现,取消订阅。
subscription.remove();

差不多就大功告成了,现在感觉还是比较简单,当时觉得好麻烦啊?。

 

评论 1
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值