美文网首页
iOS-ReactNative 体验

iOS-ReactNative 体验

作者: 守护浪漫的小香樟 | 来源:发表于2017-12-20 11:23 被阅读0次

ReactNative  是Facebook创建的利用前端代码打包APP的一套东西以下简称RN

一、RN环境搭建相信各大搜索引擎都有了在这里说一下我用那些方法遇到的问题以及注意事项:

1、初始化(init)时候总是配置文件不识别,缺少文件,解决办法:在init时候直接给上项目版本号:

react-native init FirstRN  --version 0.42.0

2、iOS加载RN的JS文件分为本地加载和根据IP加载

本地加载:

NSURL * jsCodeLocation = [[RCTBundleURLProvider sharedSettings] jsBundleURLForBundleRoot:filePath fallbackResource:nil];

IP路径加载:

NSURL * jsCodeLocation = [NSURL URLWithString:[NSString stringWithFormat:@"%@%@.bundle?platform=ios&dev=true",JSIP,urlStr]];

3、加载JS文件

ReactView * reactView = [[ReactView alloc] initWithFrame:CGRectMake(0, 0, JWidth, JHeight - 64) WithUrl:@"index.JSios"];

[self.view addSubview:reactView];

[[NSNotificationCenter defaultCenter] addObserver:self selector:@selector(doPushNotification:) name:@"RNOpenOneVC" object:nil];

4、接受JS传递的值

RCT_EXPORT_MODULE(RTModule)

//RN跳转原生界面

RCT_EXPORT_METHOD(RNOpenOneVC:(NSString *)msg){

//主要这里必须使用主线程发送,不然有可能失效

dispatch_async(dispatch_get_main_queue(), ^{

[[NSNotificationCenter defaultCenter]postNotificationName:@"RNOpenOneVC" object:msg];

}

二、RN开发中常用的控件以及布局(Demo中都有涉及):

本项目主要是集成了ReactNative,采用nodejs的开发语言,给iOS端开发页面和逻辑,提升开发效率!

主要包含了:

(1),ReactNative      listView的使用

(2),ReactNative      listView配合无限轮播图使用

(3),ReactNative      listView配合上啦加载下拉刷新使用

(4),ReactNative      常规控件的使用

(5),ReactNative      Tabbar底部导航  nav顶部导航的使用

(6),ReactNative      在原生交互传值的使用

(7),ReactNative      请求网络数据并解析调用

(8),ReactNative      webview的使用

三、github地址:https://github.com/JamesBondMine/RN2

相关文章

  • iOS-ReactNative 体验

    ReactNative 是Facebook创建的利用前端代码打包APP的一套东西以下简称RN 一、RN环境搭建相信...

  • UI必修课 交互+架构+视觉

    1 用户体验 6种基础体验 感官体验 交互体验 情感体验 信任体验 价值体验 文化体验 2 用户体验的特点 01 ...

  • 体验

    我们来到这世间,便是体验。体验一切,体验当下的一切。体验幸福,体验痛苦;体验疼痛,体验舒适;体验嫉妒,体验优越;体...

  • 体验体验体验(2020.06.28)

    线上聊千遍,不如线下见一面。 脑袋想再多,不如实际体验一下。 空想无益,反倒给大脑增添了很多的负担,踏踏实实去试一...

  • 体验,体验!

    今天坐在下面当了一个下午的听众。 五个分享嘉宾的演讲,一个下午的语言,留在我脑子里的只有一两句话和一些身体的感觉。...

  • 体验体验

    连续两天没写体验了,昨晚四点才睡好像比boss们还忙。这两天经历了情绪的大起大落,清理的时候内在疼的震颤...

  • 体验体验

    收到财神汇小兰财神的邀请参加她举办的入门第二期读书会,一共来了11位朋友,太棒了! 九点25分到工作室,一进门看到...

  • 网易用户研究——电商售后用户体验研究

    引言 电商用户体验的包含内容 商品体验 产品体验:web和app 服务体验:售前体验&物流体验&售后体验 用户研究...

  • 万物皆为师

    看一看,体验体验 花草树木…… 看一看,体验体验 山川大地…… 看一看,体验体验 江河湖泊 看一看,体验体验 日月...

  • 【原创】用户体验要素之情感体验

    情感体验:通过功能体验、业务体验、视觉体验、内容体验、交互体验等各种体验的不同表现方式而带给用户的情绪感受。在互联...

网友评论

      本文标题:iOS-ReactNative 体验

      本文链接:https://www.haomeiwen.com/subject/flxgwxtx.html