作为一名有理想、有抱负的一代iOS程序员，本着“我头发够多，还能学”的原则，我选择了追随那些大佬的脚步。
第一步：找文档、准备安装开发环境；
第二步：一步步跟着大佬的脚步，去输入命令安装（错了，是复制、粘贴）；
第三步：哇!🤩好顺利，竟然完成了（不过这是第几次才成功的，我忘记了，安装的乐趣，你们不安装，你不会懂）。
满怀信心的打开了，这一刻好有成就感，感觉自己距离大前端又近了一步，少年，你可以的，继续加油！
react native开发第一步，就是踩坑，一步一坑。记录一下：
作为一个开发者，有一个学习的氛围跟一个交流圈子特别重要，这有个iOS交流群：642363427，不管你是小白还是大牛欢迎入驻 ，分享BAT,阿里面试题、面试经验，讨论技术， 与2800+iOS开发者一起交流学习成长！
1、日常踩坑记录
Q:Invariant Violation:Text strings must be rendered within a <Text> component
A:在代码中无语中多输入了符号,注意：此类问题，在提示中一般给出了第N行错误的提示。
Q:使用 PropTypes 进行类型检 || 控制台报:TypeError: Cannot read property 'string' of undefined
A:注意： 从 React v15.5 开始 ，React.PropTypes 助手函数已被弃用，我们建议使用 prop-types 库 来定义contextTypes。
import React, {Component,PropTypes} from 'react’;//已经不能使用了,
所以在使用前：
属性的类型检查
static propTypes = {
name: PropTypes.string,
age: PropTypes.number,
sex: PropTypes.string.isRequired,
}
Q:Uncaught Error: Invariant Violation: Element type is invalid: expected a string (for built-in components) or a class/function but got: object
A:导入组件的方式由require换成import..from..
如：import Main from './Component/Main/Main.js';
2、代码段
1、 监听网状连接状态的变化
componentDidMount () {
NetInfo.addEventListener('change', this.handleConnectivityChange);
}
componentWillUnmount() {
NetInfo.removeEventListener('change', this.handleConnectivityChange);
}
handleConnectivityChange() {
NetInfo.isConnected.fetch().then(netConnected => {
if (netConnected) {
ToastAndroid.show('网络已连接', ToastAndroid.SHORT, ToastAndroid.BOTTOM)
} else {
ToastAndroid.show('请检查网络连接', ToastAndroid.SHORT, ToastAndroid.BOTTOM)
}
})
}
2、createStackNavigator, createBottomTabNavigator 路由嵌套 StackNavigator的跳转问题
class MainView extends Component {
static navigationOptions = {
header: null
};
render () {
let { isMask } = this.props.global
const { cartCount } = this.props
return (
)
}
}
MainView.router = AppTabNavigator.router
3、tabBarOnPress 拦截tab导航的tab点击事件
title: '我的',
tabBarIcon: ({focused}) => (
),
tabBarOnPress: () => {
if (!screenProps.netConnected) {
navigation.navigate('Home')
}
}
})
4、解决锁定屏幕方向 还有键盘顶起tab导航等问题
添加一行：android:screenOrientation="portrait"
设置为portrait是锁定竖向，landscape是锁定横向
网友评论