nextState：將要設(shè)置的新?tīng)顟B(tài)，該狀態(tài)會(huì)和當(dāng)前的 state 合并；
callback：可選參數(shù)，回調(diào)函數(shù)。該函數(shù)會(huì)在 setState 設(shè)置成功，且組件重新渲染后調(diào)用。

注意事項(xiàng)

不能在組件內(nèi)部通過(guò) this.state 修改狀態(tài)，因?yàn)樵摖顟B(tài)會(huì)在調(diào)用 setState() 后被替換。
setState() 并不會(huì)立即改變 this.state，而是創(chuàng)建一個(gè)即將處理的 state。setState()并不一定是同步的，為了提升性能 React 會(huì)批量執(zhí)行 state 和 DOM 渲染。
setState() 總是會(huì)觸發(fā)一次組件重繪，除非在 shouldComponentUpdate() 中實(shí)現(xiàn)了一些條件渲染邏輯。

使用

<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8" />
<title>React demo</title>
<script src="https://cdn.staticfile.org/react/16.4.0/umd/react.development.js"></script>
<script src="https://cdn.staticfile.org/react-dom/16.4.0/umd/react-dom.development.js"></script>
<script src="https://cdn.staticfile.org/babel-standalone/6.26.0/babel.min.js"></script>
</head>
<body>

<div id="example"></div>
<script type="text/babel">
class Counter extends React.Component{
  constructor(props) {
      super(props);
      this.state = {count: 0};
      this.handleClick = this.handleClick.bind(this);
  }
  
  handleClick() {
    this.setState((state) =>{
      return {count: state.count + 1};
    });
  }
  render () {
    return (<h2 onClick={this.handleClick}>點(diǎn)我！點(diǎn)擊次數(shù)為: {this.state.count}</h2>);
  }
}
ReactDOM.render(
  <Counter />,
  document.getElementById('example')
);
</script>

</body>
</html>

頁(yè)面效果：

注意：

上面例子中，有一句 this.handleClick = this.handleClick.bind(this)。

用 class 來(lái)創(chuàng)建 react 組件時(shí)，有一件很麻煩的事情，就是this 的指向問(wèn)題。類(lèi)的方法默認(rèn)是不會(huì)綁定 this 的，為了保證 this 的指向正確，需要寫(xiě)這樣的代碼：

this.handleClick = this.handleClick.bind(this)

或者是這樣的代碼：

<button onClick={() => this.handleClick(e)}>

如果忘記綁定 this.handleClick 并把它傳入 onClick，調(diào)用這個(gè)函數(shù)的時(shí)候 this 的值會(huì)是 undefined。

replaceState

replaceState(object nextState[, function callback])

參數(shù)說(shuō)明

nextState：將要設(shè)置的新?tīng)顟B(tài)，該狀態(tài)會(huì)替換當(dāng)前的 state。
callback：可選參數(shù)，回調(diào)函數(shù)。該函數(shù)會(huì)在 replaceState 設(shè)置成功，且組件重新渲染后調(diào)用。

replaceState() 方法與 setState() 類(lèi)似，但是方法只會(huì)保留 nextState 中狀態(tài)，原state 不在 nextState 中的狀態(tài)都會(huì)被刪除。

setProps

setProps(object nextProps[, function callback])

參數(shù)說(shuō)明

nextProps：將要設(shè)置的新屬性，該狀態(tài)會(huì)和當(dāng)前的 props 合并
callback：可選參數(shù)，回調(diào)函數(shù)。該函數(shù)會(huì)在 setProps 設(shè)置成功，且組件重新渲染后調(diào)用。

設(shè)置組件屬性，并重新渲染組件。

props 相當(dāng)于組件的數(shù)據(jù)流，它總是會(huì)從父組件向下傳遞至所有的子組件中。
當(dāng)和一個(gè)外部的 JavaScript 應(yīng)用集成時(shí)，可能會(huì)需要向組件傳遞數(shù)據(jù)或通知 React.render() 組件需要重新渲染，可以使用setProps()。
更新組件，可以在節(jié)點(diǎn)上再次調(diào)用React.render()，也可以通過(guò)setProps() 方法改變組件屬性，觸發(fā)組件重新渲染。

replaceProps

replaceProps(object nextProps[, function callback])

參數(shù)說(shuō)明

nextProps：將要設(shè)置的新屬性，該屬性會(huì)替換當(dāng)前的 props。
callback：可選參數(shù)，回調(diào)函數(shù)。該函數(shù)會(huì)在 replaceProps 設(shè)置成功，且組件重新渲染后調(diào)用。

replaceProps() 方法與 setProps 類(lèi)似，但它會(huì)刪除原有 props。

forceUpdate

forceUpdate([function callback])

參數(shù)說(shuō)明

callback：可選參數(shù)，回調(diào)函數(shù)。該函數(shù)會(huì)在組件render()方法調(diào)用后調(diào)用。

forceUpdate() 方法會(huì)使組件調(diào)用自身的 render() 方法重新渲染組件，組件的子組件也會(huì)調(diào)用自己的 render()。但是，組件重新渲染時(shí)，依然會(huì)讀取 this.props 和this.state，如果狀態(tài)沒(méi)有改變，那么React 只會(huì)更新 DOM。
forceUpdate()方法適用于 this.props 和 this.state 之外的組件重繪（如：修改了this.state 后），通過(guò)該方法通知 React 需要調(diào)用 render()。
一般來(lái)說(shuō)，應(yīng)該盡量避免使用 forceUpdate()，而僅從 this.props 和 this.state 中讀取狀態(tài)并由 React 觸發(fā) render() 調(diào)用。

findDOMNode

DOMElement findDOMNode()

返回值：DOM 元素 DOMElement

如果組件已經(jīng)掛載到 DOM 中，該方法返回對(duì)應(yīng)的本地瀏覽器 DOM 元素。
當(dāng) render 返回 null 或 false 時(shí)，this.findDOMNode() 也會(huì)返回 null。從 DOM 中讀取值的時(shí)候，該方法很有用，如：獲取表單字段的值和做一些 DOM 操作。