总想说点啥
最近在学习ReactNative,感慨良多;由于当年太任性,没有好好学习JS,现在想想可谓是痛心疾首啊!不过话又说回来,好像ReactNative跟JS没有什么太大的关联,但又没有太大的区别(以上是个人观点,不代表任何立场;本人是个菜鸟一枚,见解不到位的,望大神私信指正,在此先叩谢!)。
使用ReactNative需要搭建RN开发环境,在此就不介绍了,因为网上特别多,请随意百度;而我采用的是FaceBook推荐的IDE(Atom+Nuclide)安装教程(Windows平台的小伙伴还请自行百度哦),这样安装可以解决网上说的Atom性能卡顿的问题。
书归正传
ReactNative常见问题汇总笔记一
1. Can't find variable: xxxx
问题分析:搞IT的就算英文再烂应该也能看懂这句log吧,所以缺少什么就导入什么文件;
Debug:是系统自带的Component的话,就在当前JS中找到Import {........} from 'react-native',在{}中添加对应的名称就可以了;如果不是系统的,那就自行创建这个Component.
2. Unable to find this module in its module map or any of the node_modules directories under ......
问题分析:这句话的意思是‘在模块映射或任何node_modules目录下都无法找到该模块’,因此查看一下是否有引用到没有导入的Component;
Debug:因此找到图中的module 在代码中核查这个路径是否存在该Component;解决方法如下:
改正前:
import MySceneComponent from '../MySceneComponent';
改正后:
import MySceneComponent from './MySceneComponent';
3. Unhandled JS Exception: null is not an object (evaluating 'this.state.xxx')
问题分析:ES6的初始化需要把初始化的对象放在Constructor方法中,而不是放在getInitialState中;而如果是采用的是React.createClass的话就是可以把初始化放在getInitialState之中,因此分情况而定;
Debug:具体情况具体分析。
#######4. this.setState is not a function
问题分析:是说这个状态设置不是一个函数;在react中的this作为的是组件的实例,当成功回调的时候,就改变了this的指向;react中支持箭头(=>)指向this,和bind()函数绑定组件实例(注:据说bind()是ES5的方法,由于我的ES没有一点点的涉及,所以这是网友说的);
Debug:根据红色的错误日志点击第一条日志,然后在IDE中修改代码为
使用bind()绑定组件方案:
onRefresh={this._onRefresh.bind(this)}
使用ES6新特性箭头函数=>()的解决方案:
onRefresh={() => {this._onRefresh()}}
总结一下
由于本人也是在学习当中,所以这些全部是当成笔记来记得,如果有不对的地方,还望各位看官评论或私信指出;后续遇到的问题,还会继续总结归纳;