一、簡單記錄React的組件的簡潔的生命周期API：
A：實例化期：
一個實例第一次被創建時所調用的API與其它后續實例被創建時所調用的API略有不同。
實例第一次被創建時會調用getDefaultProps，而后續實例創建時不會調用這個方法。
實例被創建時，依次被調用的API有：
getDefaultProps：
實例第一次被創建時才調用，對於組件類來說，它只調用一次。
這個方法返回的對象可為實例設置默認的props值。
getInitialState：
對於每個實例來說，這個方法只調用一次。每次創建實例時執行一次。
在這里初始化每個實例的state，在這里可以訪問到this.props。
componentWillMount：
在首次渲染之前被調用，在渲染之前更改組件state的最后機會。
render：
組件的唯一必需方法。創建虛擬DOM，表示組件輸出。
只能通過this.props和this.state訪問數據。
可以return null，return false，或return 任何React組件。
只能有一個頂級組件。
不能改變組件狀態，或修改DOM的輸出。
（注，render返回的結果說虛擬DOM，React隨后會把它和真實DOM做對比，來判斷是否有必要做出修改）
componentDidMount：
render成功調用並且真實DOM也已經被渲染后，這個方法會調用。
在這里可以通過this.getDOMNode()方法訪問真實的DOM。
例如需要測量DOM元素的寬度和高度等屬性，可以在這個方法里做。
（注，React跑在Server端時，componentDidMount不會被調用）
B：存在期：
隨着應用狀態的改變，以下API依次被調用：
componentWillReceiveProps
shouldComponentUpdate
componentWillUpdate
render
componentDidUpdate
C：銷毀期：
組件被用完后，以下API被調用，給實例清理自身：
componentWillUnmount
注意反模式：
在getInitialState方法里，通過this.props來創建state的方法是一種反模式！
React專注於維護數據的單一來源，當組件的state值和它所基於的prop不同步時，是一種反模式！
反模式例子：
getDefaultProps: function() {
return { date: new Date() }
};
getInitialState: function() {
return {
day: this.props.date.getDay() // 不要在這里計算
}
};
render: function() {
return <div>Day is: {this.state.day}</div>;
};
正確的模式應該是在渲染時計算：（保證計算后的值不會與派生出它的props值不同步）
getDefaultProps: function() {
return { date: new Date() }
};
render: function() {
var day = this.props.date.getDay(); // 在渲染時做計算是正確的
return <div>Day is: {day}</div>;
};
注意，組件可以用this.props訪問props，但不能修改自己的props！
關於state：
每個組件都有自己的state。state和props區別在於state只存在於組件內部。
state用來確定一個元素的視圖狀態。
state可以用setState或replaceState來修改。（不能用this.state來修改state）
只要setState或replaceState被調用，render就會被調用。如果render返回值有變化，DOM就會被更新。
二、React的事件處理：
事件文檔：http://facebook.github.io/react/docs/events.html
綁定一個事件處理器：
React.DOM.button({className:"btn", onClick: this.handleSendClick}, "Send");
觸控事件需要調用這個方法來手動啟動：React.initializeTouchEvents(true);
更新組件狀態會觸發組件重繪。
setState會更新某一個state屬性，而replaceState會替換掉整個state對象。
在綁定的事件處理器里做setState：
getInitialState: function() {
return { title: "Title 1.0" }
};
handlePageOnload: function(ev) {
this.setState({title: "Title 2.0"});
ev.preventDefault(); // 非必需，視情況而定
};
小結：更改state只能用setState或replaceState，因為它們可以通知React重繪DOM，即調用render方法。
補充：關於處理input的onChange事件：
handleComplete: function(event) {
this.callMethodOnProps("onCompleted", event.target.value);
};
render: function() {
return <textarea onBlur="{this.handleComplete}"></textarea>
};
注意，使用event.target.value獲取input值是一種常規方法。