react.js學習之路二

標籤：this   bin   http   分組   input   頁面   存在   不難   樣本   

看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學習之路二