react.js学习之路二

Posted liumcb

tags:

篇首语:本文由小常识网(cha138.com)小编为大家整理,主要介绍了react.js学习之路二相关的知识,希望对你有一定的参考价值。

看react.js对我来说真的不是难不难的问题,问题是我的思路太难转变了,真是坑死我了,react里面的坑也很多。算了,这些抱怨没啥用,记录一下今天学习的内容。

今天看了to-do-list经典示例

总结起来可以概括为

1.首先划分组件:父组件--子组件

2.显示数据:创建初始数据,并将数据显示到页面上

3.创建函数:①:添加函数,输入框中输入数据,显示到页面上

      ②:删除函数,点击删除按钮,将该条数据删除

 

代码有很多,一会给一个链接,自己看就行,没必要我重新复制

其中踩过的坑:

 

 1. 首先就是版本的不同,所以函数有不同,在例子中使用的是

 this.refs.inputnew.getDOMNode();
但是,新版本中这个函数不存在,所以要用ReactDOM.findDOMNode(this.refs.inputnew);代替;

2.就是绑定函数bind(this);
bind(this)是子组件改变了父组件,利用this来确保指向是正确的,要使用bind(this)来绑定;

总体来说,学习react的难度不是代码有多难,而是对于经常使用js的程序员来说,这个思路的转变很痛苦
还有就是在学习中,我一直在找一些小的项目,比如这个to-do-list项目,这样实用性很强的项目 ,但是不太好找,以后我就把这样的项目全部汇总,以便别人找的时候不是那么困难了。



经典项目一:to-do-list项目

链接:http://www.cnblogs.com/wangfupeng1988/p/5302738.html

以上是关于react.js学习之路二的主要内容,如果未能解决你的问题,请参考以下文章

react.js学习之路二

react.js学习之路六

react js踩坑之路

React Native 爬坑之路

JVM进阶之路十二:字节码指令

Python学习之路一