iOS原生给React-Native的js发通知

iOS原生与React-Native通信(不依赖于视图控件)

最近在写RN项目的时候遇到一个问题:当接收到后台推送的消息或者其他应用跳转过来,需要打开APP并跳转到指定页面。

这个对于iOS原来来说比较方便。一个全部React-Native(本文称为RN)实现的APP,RN对于iOS原生来说就是一个RCTRootView控制器。原生无法直接跳转RN的内部的控制器。必须要由iOS原生去通知RN并将参数传递给RN,由RN来进行跳转。

下面大致捋一下思路:

  • 新建RCTBridgeModule的Module类
  • 发通知告诉Module类与RN进行通信
  • RN在合适的位置监听Module类中的方法,接收到原生信息后进行响应操作

iOS原生部分

新建RCTBridgeModule的Module类

新建Module类,通过Module桥接与RN进行通信。这个module其实可以实现很多功能,比如自定义iOS原生视图控件、RN调取iOS原生的SDK等。当然本次要讲的是它实现iOS原生不基于控件与哦RN进行通信。

RNBridgeModule.h

新建RNBridgeModule.h,继承RCTBridgeModule

import <Foundation/Foundation.h>

import "RCTBridgeModule.h"

@interface RNBridgeModule : NSObject<RCTBridgeModule>

@end

RNBridgeModule.m

引入RCTEventDispatcher.h,通过RCTEventDispatcher中的方法与RN进行通信。

这里需要想办法接收iOS原生其他控制器中传递过来消息,由于桥接文件不用在其他控制器中进行实例化,所以通过代理这思路可以放弃了。还是直接使用通知进行监听吧

import "RNBridgeModule.h"

import "RCTBridge.h"

import "RCTEventDispatcher.h"

@implementation RNBridgeModule

@synthesize bridge = _bridge;

RCT_EXPORT_MODULE()

// 注册通知监听,这里为确保程序起来就可以实现监听,选择了在初始化方法中实现。

  • (instancetype)init {

    self = [super init];

    [[NSNotificationCenter defaultCenter] addObserver:self

                                         selector:@selector(receiveSalesNotifaction:)
    
                                             name:@"comeFromSales"
    
                                           object:nil];
    

    return self;

}

// 接收通知后将通知传递的参数一起传递给RN

  • (void)receiveSalesNotifaction:(NSNotification *)notify

{

[self.bridge.eventDispatcher sendAppEventWithName:@"EventReminder" body:notify.object];

}

React-Native部分

找到合适的位置监听原生的传递过来的方法
这里建议是app.js或者是index.js中去实现,确保程序起来后就能监听到原生方法。

监听原生的方法

这里选择了app.js(index.android.js和index.ios.js均以它作为入口)

先引入NativeAppEventEmitter

import {

NativeAppEventEmitter,

} from 'react-native';

申明订阅者

let subscription; // 订阅者

监听并执行响应操作

componentDidMount() {

subscription = NativeAppEventEmitter.addListener(

     'EventReminder',

      (reminder) => {

        const errorCode = reminder.errorCode;

        if (errorCode === 0) {

          console.log('====errorCode===');

          this.setState({ msg: reminder.name });

        } else {

          console.log('====监听成功===');

        }

      }

     );

}

在componentWillUnmount移除监听

componentWillUnmount() {

subscription.remove();

}

通信已经实现。

最后编辑于
©著作权归作者所有,转载或内容合作请联系作者
  • 序言:七十年代末,一起剥皮案震惊了整个滨河市,随后出现的几起案子,更是在滨河造成了极大的恐慌,老刑警刘岩,带你破解...
    沈念sama阅读 203,324评论 5 476
  • 序言:滨河连续发生了三起死亡事件,死亡现场离奇诡异,居然都是意外死亡,警方通过查阅死者的电脑和手机,发现死者居然都...
    沈念sama阅读 85,303评论 2 381
  • 文/潘晓璐 我一进店门,熙熙楼的掌柜王于贵愁眉苦脸地迎上来,“玉大人,你说我怎么就摊上这事。” “怎么了?”我有些...
    开封第一讲书人阅读 150,192评论 0 337
  • 文/不坏的土叔 我叫张陵,是天一观的道长。 经常有香客问我,道长,这世上最难降的妖魔是什么? 我笑而不...
    开封第一讲书人阅读 54,555评论 1 273
  • 正文 为了忘掉前任,我火速办了婚礼,结果婚礼上,老公的妹妹穿的比我还像新娘。我一直安慰自己,他们只是感情好,可当我...
    茶点故事阅读 63,569评论 5 365
  • 文/花漫 我一把揭开白布。 她就那样静静地躺着,像睡着了一般。 火红的嫁衣衬着肌肤如雪。 梳的纹丝不乱的头发上,一...
    开封第一讲书人阅读 48,566评论 1 281
  • 那天,我揣着相机与录音,去河边找鬼。 笑死,一个胖子当着我的面吹牛,可吹牛的内容都是我干的。 我是一名探鬼主播,决...
    沈念sama阅读 37,927评论 3 395
  • 文/苍兰香墨 我猛地睁开眼,长吁一口气:“原来是场噩梦啊……” “哼!你这毒妇竟也来了?” 一声冷哼从身侧响起,我...
    开封第一讲书人阅读 36,583评论 0 257
  • 序言:老挝万荣一对情侣失踪,失踪者是张志新(化名)和其女友刘颖,没想到半个月后,有当地人在树林里发现了一具尸体,经...
    沈念sama阅读 40,827评论 1 297
  • 正文 独居荒郊野岭守林人离奇死亡,尸身上长有42处带血的脓包…… 初始之章·张勋 以下内容为张勋视角 年9月15日...
    茶点故事阅读 35,590评论 2 320
  • 正文 我和宋清朗相恋三年,在试婚纱的时候发现自己被绿了。 大学时的朋友给我发了我未婚夫和他白月光在一起吃饭的照片。...
    茶点故事阅读 37,669评论 1 329
  • 序言:一个原本活蹦乱跳的男人离奇死亡,死状恐怖,灵堂内的尸体忽然破棺而出,到底是诈尸还是另有隐情,我是刑警宁泽,带...
    沈念sama阅读 33,365评论 4 318
  • 正文 年R本政府宣布,位于F岛的核电站,受9级特大地震影响,放射性物质发生泄漏。R本人自食恶果不足惜,却给世界环境...
    茶点故事阅读 38,941评论 3 307
  • 文/蒙蒙 一、第九天 我趴在偏房一处隐蔽的房顶上张望。 院中可真热闹,春花似锦、人声如沸。这庄子的主人今日做“春日...
    开封第一讲书人阅读 29,928评论 0 19
  • 文/苍兰香墨 我抬头看了看天上的太阳。三九已至,却和暖如春,着一层夹袄步出监牢的瞬间,已是汗流浃背。 一阵脚步声响...
    开封第一讲书人阅读 31,159评论 1 259
  • 我被黑心中介骗来泰国打工, 没想到刚下飞机就差点儿被人妖公主榨干…… 1. 我叫王不留,地道东北人。 一个月前我还...
    沈念sama阅读 42,880评论 2 349
  • 正文 我出身青楼,却偏偏与公主长得像,于是被迫代替她去往敌国和亲。 传闻我的和亲对象是个残疾皇子,可洞房花烛夜当晚...
    茶点故事阅读 42,399评论 2 342

推荐阅读更多精彩内容