組件 API

ReactComponent

React 組件實例在渲染的時候創(chuàng)建。這些實例在接下來的渲染中被重復使用，可以在組件方法中通過 this 訪問。唯一一種在 React 之外獲取 React 組件實例句柄的方式就是保存 React.render 的返回值。在其它組件內(nèi)，可以使用 refs 得到相同的結(jié)果。

setState

setState(object nextState[, function callback])

合并 nextState 和當前 state。這是在事件處理函數(shù)中和請求回調(diào)函數(shù)中觸發(fā) UI 更新的主要方法。另外，也支持可選的回調(diào)函數(shù)，該函數(shù)在 setState 執(zhí)行完畢并且組件重新渲染完成之后調(diào)用。

注意：

絕對不要直接改變 this.state，因為在之后調(diào)用 setState() 可能會替換掉你做的更改。把 this.state 當做不可變的。

setState() 不會立刻改變 this.state，而是創(chuàng)建一個即將處理的 state 轉(zhuǎn)變。在調(diào)用該方法之后獲取 this.state 的值可能會得到現(xiàn)有的值，而不是最新設(shè)置的值。

不保證 setState() 調(diào)用的同步性，為了提升性能，可能會批量執(zhí)行 state 轉(zhuǎn)變和 DOM 渲染。

setState() 將總是觸發(fā)一次重繪，除非在 shouldComponentUpdate() 中實現(xiàn)了條件渲染邏輯。如果使用可變的對象，但是又不能在 shouldComponentUpdate() 中實現(xiàn)這種邏輯，僅在新 state 和之前的 state 存在差異的時候調(diào)用 setState() 可以避免不必要的重新渲染。

replaceState

replaceState(object nextState[, function callback])

類似于 setState()，但是刪除之前所有已存在的 state 鍵，這些鍵都不在 nextState 中。

forceUpdate()

forceUpdate([function callback])

如果 render() 方法從 this.props 或者 this.state 之外的地方讀取數(shù)據(jù)，你需要通過調(diào)用 forceUpdate() 告訴 React 什么時候需要再次運行 render()。如果直接改變了 this.state，也需要調(diào)用 forceUpdate()。

調(diào)用 forceUpdate() 將會導致 render() 方法在相應的組件上被調(diào)用，并且子級組件也會調(diào)用自己的 render()，但是如果標記改變了，那么 React 僅會更新 DOM。

通常情況下，應該盡量避免所有使用 forceUpdate() 的情況，在 render() 中僅從 this.props 和 this.state 中讀取數(shù)據(jù)。這會使應用大大簡化，并且更加高效。

getDOMNode

DOMElement getDOMNode()

如果組件已經(jīng)掛載到了 DOM 上，該方法返回相應的本地瀏覽器 DOM 元素。從 DOM 中讀取值的時候，該方法很有用，比如獲取表單字段的值和做一些 DOM 操作。當 render 返回 null 或者 false 的時候，this.getDOMNode() 返回 null。

isMounted()

bool isMounted()

如果組件渲染到了 DOM 中，isMounted() 返回 true?？梢允褂迷摲椒ūＷC setState() 和 forceUpdate() 在異步場景下的調(diào)用不會出錯。

setProps

setProps(object nextProps[, function callback])

當和一個外部的 JavaScript 應用集成的時候，你可能想給一個用 React.render() 渲染的組件打上改變的標記。

盡管在同一個節(jié)點上再次調(diào)用 React.render() 來更新根組件是首選的方式，也可以調(diào)用 setProps() 來改變組件的屬性，觸發(fā)一次重新渲染。另外，可以傳遞一個可選的回調(diào)函數(shù)，該函數(shù)將會在 setProps 完成并且組件重新渲染完成之后調(diào)用。

注意：

When possible, the declarative approach of calling React.render() again is preferred; it tends to make updates easier to reason about. (There's no significant performance difference between the two approaches.)

剛方法僅在根組件上面調(diào)用。也就是說，僅在直接傳給 React.render() 的組件上可用，在它的子級組件上不可用。如果你傾向于在子組件上使用 setProps()，不要利用響應式更新，而是當子組件在 render() 中創(chuàng)建的時候傳入新的 prop 到子組件中。

replaceProps

replaceProps(object nextProps[, function callback])

類似于 setProps()，但是刪除所有已存在的 props，而不是合并新舊兩個 props 對象。