优购微零售，是一款依托百丽集团的品牌商品，依靠分享推荐商品，既满足购物需求，同时又能够获得分享红利。
3月25日，公司领导紧急通知，由于原来微零售项目负责人离职，app，h5和app服务端都要由我这边团队来做。而且时间特别急，需要在4月底全部提交测试，并在6月1日之前上线。
h5和app服务端我倒是不担心，主要担心的就是app。之前那个负责人规划的是用嵌套H5的方式。但是，我之前有过用类似的方式开发一个helloworld程序的体验，感觉效果很差。
我的团队都是以后台开发为主，只有一个伙伴是干了半年android的维护，不过他说看过需求，问题不大。
有一个兄弟团队的人告诉我，用react-native。 看了一天文档，我就决定搞一把了。
为啥会有这个决定呢，其实，我心里也早就想好了，android这边问题应该不会很大。所以，前期保证android正常上线，ios稍微拖一两周也能说得过去。
就此，走上了一条rn的探索道路。
先说下结果，我们在5月上旬开发完了ios的版本提交测试，比原计划稍微晚了一周左右。5月28日，一次提交就通过了苹果的审核。
这次的RN体会，让我对客户端开发有了一种愉悦的感觉，之前一直抵触ios开发，觉得objective-c太别扭。
遇到几个问题：
在RCTNavigator.m中
- (void)navigationController:(UINavigationController *)navigationController
willShowViewController:(__unused UIViewController *)viewController
animated:(__unused BOOL)animated
这个方法一开始的地方加入：
RCTWrapperViewController * thisController = (RCTWrapperViewController *)viewController;
if (navigationController.viewControllers.count > 1) {
thisController.tabBarController.tabBar.hidden = YES;
} else {
thisController.tabBarController.tabBar.hidden = NO;
}
我们在使用
this.props.navigator.push({
component: 跳转到的页面,参数一：参数值
});发现，这个参数一无法在跳转的页面里面接收。
仔细检查一下我们的navigator系统,我们发现,在设置navigator的时候，我们使用了：
<Component {...route.params} navigator={navigator} />
按照网上一些做法，通过他们都是这样来传值的：
this.props.navigator.push({
component: @R_169_404@面,params: {
参数一：参数值
}
})在下一个页面，通过this.props.参数一来获取。
但是这种方式，在我们这里始终无法获取值，真不知道啥原因，求大神指点。
最后我们，在设置navigator的时候，这么写的：
<Component {...route.params} navigator={navigator} route={route}/>加入了route，跳转传值还是按照第一种方式，获取值采用 this.props.route.参数一来获取传递的值。
3. 图片
建议所有图片全部放到ios的xcode项目中去，然后采用 require('image!图片名')的方式，通过相对路径引用图片，我们本地老出现文件编码错误的提示。
4. 尽量不适用 带IOS后缀的组件
5. 一定要用CodePUSH
6.react-native Image里面嵌入text实现透明背景
<Image ref='storeBackgroundImage'
source={{uri: 'https://facebook.github.io/react/img/logo_og.png'}}
style={{flex: 3.4,alignItems:'center',justifyContent:'center'}}>
<Image ref='storelogo' source={{uri: 'https://facebook.github.io/react/img/logo_og.png'}} style={styles.storeImage}/>
<View style={{backgroundColor: 'rgba(0,0)'}}>
<Text>店铺的名称</Text>
</View>
<View style={{backgroundColor: 'rgba(0,0)'}}>
<Text>店铺的名称</Text>
</View>
</Image>
在Text上层嵌套一个View，设置背景色 0，0，0，0即可。
7. 在变量前面加上global. 就是全局变量
8. 用 `` 实现字符串替换
var {id,name} = this.props.user;
var firstName = name.split(' ')[0]; // TODO: problems with i18n
return (
<TouchableOpacity style={styles.pog} onPress={this.props.onPress}>
<Image
style={styles.profilePic}
source={{uri: `http://graph.facebook.com/${id}/picture`}}
/>
<Text style={styles.text}>
{firstName}
</Text>
</TouchableOpacity>
);
后续要加入Redux，还有好多事儿要做。
加油。
