RN跳转到ios原生页面的实现

***如何从RN页面,再跳转到原生VC页面?

首先,已经做好了一个RN页面,即,由RCTRootView解析转化原生的UIView,即可实现原生页面跳转到RN页面。具体步骤略...

下面来看,从RN跳到原生页面。

1、新建 RCTModules 类(继承自NSObject)
封装一个方法,使用“通知”进行消息的传送,从而实现页面的跳转。

#import <Foundation/Foundation.h>
#import <React/RCTBridgeModule.h>

@interface RTModule : NSObject<RCTBridgeModule>
@end
#import "RTModule.h"
#import <React/RCTBridge.h>

@implementation RTModule

RCT_EXPORT_MODULE(RTModule)
//RN跳转原生界面
RCT_EXPORT_METHOD(RNOpenOneVC:(NSString *)msg){
    
    NSLog(@"RN传入原生界面的数据为:%@",msg);
    //主要这里必须使用主线程发送,不然有可能失效
    dispatch_async(dispatch_get_main_queue(), ^{
        [[NSNotificationCenter defaultCenter]postNotificationName:@"RNOpenOneVC" object:nil];
    });
}

@end

2、在加载(RCTRootView)的原生VC页面中
添加通知

[[NSNotificationCenter defaultCenter] addObserver:self selector:@selector(doPushNotification:) name:@"RNOpenOneVC" object:nil];
实现通知触发方法
- (void)doPushNotification:(NSNotification *)notification{
    NSLog(@"成功收到===>通知");

    OneViewController *vc = [[OneViewController alloc]init];    //目标VC
    [self.navigationController pushViewController:vc animated:YES];
    
    //注意不能在这里移除通知,否则push进去后有pop失效
}

3、在RN的js代码中
发出RNOpenOneVC通知

var RNModules = NativeModules.RTModule;
...

<View style={styles.container}>
            <TouchableOpacity
               onPress={()=>RNModules.RNOpenOneVC('测试')}>
                   <Text>跳转按钮</Text>
            </TouchableOpacity>      </View>


这样,就可以成功实现从RN页面,再跳转到原生VC页面了。

©著作权归作者所有,转载或内容合作请联系作者
平台声明:文章内容(如有图片或视频亦包括在内)由作者上传并发布,文章内容仅代表作者本人观点,简书系信息发布平台,仅提供信息存储服务。

推荐阅读更多精彩内容