關於react的一點工做總結

    首先，react是Facebook開發的一套前端框架，僅僅是MVC中的V。核心思想是「封裝組件」，組件封裝後能夠做爲一個獨立的實體被引入到新的組件中，這樣新的組件就又是一個實體了，因爲組件的實現了可複用，因此是大大減少了開發的工做量。

*react的值能夠分爲私有和公有，私有的值通常就用this.state來表示了好比：

<Input type="password" before={passwordIcon} name="passwordAgain" id="againPassword「onChange={this.handleAgainChange} value={this.state.passwordAgain} error={this.state.error} placeholder="確認密碼"/>,

 

和這個相關的就是setState了，通常用在事件裏面，用來更改數據。

handleChange(e) {
  this.props.validate(e.target.value);  this.setState({passwordAfter: e.target.value});
}

不過這樣的話瀏覽器會報錯說setState沒有定義，解決方法呢就是要再構造函數裏bind一下，像這樣：this.handleChange = this.handleChange.bind(this);

*公有的呢就是props了，props用於父子組件之間的通訊，super(props);放在構造函數裏就能夠把父組件裏的屬性繼承下來了，當須要從父組件繼承的時候，使用this.props就能夠了，以下：

handleClick() {
  this.props.onSubmit(this.state.passwordBefore, this.state.passwordAfter, this.state.passwordAgain);
}

*react的生命週期基本上就是組件執行的過程了：

第一步執行的是getInitialState,只在組件裝載以前調用一次；

第二步是getDefaultProps，做用是隻在組件建立時調用一次並緩存返回的對象。

第三步執行的是render,使用原生html標籤或者子組件組裝生成這個組件的html結構，也能夠返回 null 或者 false，這時候 ReactDOM.findDOMNode(this) 會返回 null。

第四步：裝載組件觸發：componentWillMount 只會在裝載以前調用一次，在 render 以前調用，你能夠在這個方法裏面調用 setState 改變狀態，而且不會致使額外調用一次 render。componentDidMount 只會在裝載完成以後調用一次，在 render 以後調用，從這裏開始能夠經過ReactDOM.findDOMNode(this) 獲取到組件的 DOM 節點。

更新組件觸發：（內嵌循環執行的）

componentWillReceiveProps

shouldComponentUpdate

componentWillUpdate

componentDidUpdate   

這些組件不會在首次render組件的週期調用。

最後一步呢是卸載組件觸發：componentWillUnmount

*以上爲react的一些基本概念，一些比較好的學習資源跟你們分享一下：

1入門教程

2Facebook github上的使用文檔，比較全