React是React庫的入口點。如果您從<script>標(biāo)記加載React ，則這些頂級API可在React全局中使用。如果你使用npm的ES6，你可以寫import React from 'react'。如果你使用npm的ES5，你可以寫var React = require('react')。

概觀

組件

React組件讓你可以將UI分成獨立的，可重用的部分，并且可以獨立思考每個部分。React組件可以通過子類化React.Component或React.PureComponent。

• React.Component

• React.PureComponent

如果您不使用ES6類，則可以使用create-react-class模塊。有關(guān)更多信息，請參閱使用不帶ES6的React。

創(chuàng)建React元素

我們建議使用JSX來描述你的UI應(yīng)該是什么樣子。每個JSX元素都只是調(diào)用的語法糖React.createElement()。如果您使用JSX，通常不會直接調(diào)用以下方法。

• createElement()

• createFactory()

有關(guān)更多信息，請參閱使用不帶JSX的React。

轉(zhuǎn)換元素

React 還提供了其他一些API：

• cloneElement()

• isValidElement()

• React.Children

參考

React.Component

React.Component是React組件在使用ES6類定義時的基類：

class Greeting extends React.Component {  render() {    return <h1>Hello, {this.props.name}</h1>;  }}

請參閱React.Component API參考以獲取與基React.Component類相關(guān)的方法和屬性列表。

React.PureComponent

React.PureComponent是完全一樣的React.Component，但實現(xiàn)shouldComponentUpdate()了一個淺的道具和狀態(tài)比較。

如果您的React組件的render()函數(shù)在給定相同的道具和狀態(tài)的React.PureComponent情況下呈現(xiàn)相同的結(jié)果，則可以在某些情況下用于提高性能。

需要注意   React.PureComponent的shouldComponentUpdate()只有淺淺的對象進行比較。如果這些包含復(fù)雜的數(shù)據(jù)結(jié)構(gòu)，則可能會對更深的差異產(chǎn)生假陰性結(jié)果。只有PureComponent在您期望擁有簡單的道具和狀態(tài)時才會擴展，或者forceUpdate()在知道深層數(shù)據(jù)結(jié)構(gòu)發(fā)生變化時使用?；蛘?，考慮使用不可變對象以便快速比較嵌套數(shù)據(jù)。此外，React.PureComponent的shouldComponentUpdate()跳過整個組件樹道具更新。確保所有兒童組件都是“純”的。

createElement()

React.createElement(
  type,  [props],  [...children])

創(chuàng)建并返回給定類型的新React元素。type參數(shù)可以是標(biāo)記名稱字符串（如'div'或'span'），也可以是React組件類型（類或函數(shù)）。

用JSX編寫的代碼將被轉(zhuǎn)換為使用React.createElement()。React.createElement()如果您使用JSX，通常不會直接調(diào)用。請參閱無JSX的React以了解更多信息。

cloneElement()

React.cloneElement(
  element,  [props],  [...children])

以克隆和返回一個新的React元素element為起點。由此產(chǎn)生的元素將具有原始元素的道具，新道具融合得很淺。新的孩子將取代現(xiàn)有的孩子。key并ref從原始元素中保存下來。

React.cloneElement() 幾乎相當(dāng)于：

<element.type {...element.props} {...props}>{children}</element.type>

但是，它也保留了refs。這意味著如果你得到一個帶著ref它的孩子，你不會意外地從你的祖先那里偷走它。您將獲得與ref新元素相同的附加信息。

此API是作為已棄用的替代品而引入的React.addons.cloneWithProps()。

createFactory()

React.createFactory(type)

返回一個生成給定類型的React元素的函數(shù)。類似的React.createElement()，類型參數(shù)可以是標(biāo)簽名稱字符串（如'div'或'span'），也可以是React組件類型（類或函數(shù)）。

這個幫助程序被認(rèn)為是遺留的，我們鼓勵您使用JSX或React.createElement()直接使用。

React.createFactory()如果您使用JSX，通常不會直接調(diào)用。請參閱無JSX的React以了解更多信息。

isValidElement()

React.isValidElement(object)

驗證對象是一個React元素。返回true或false。

React.Children

React.Children提供用于處理this.props.children不透明數(shù)據(jù)結(jié)構(gòu)的實用程序。

React.Children.map

React.Children.map(children, function[(thisArg)])

上調(diào)用包含在每一個直系子的功能children與this設(shè)置為thisArg。如果children是鍵控片段或數(shù)組，它將被遍歷：該函數(shù)永遠(yuǎn)不會傳遞容器對象。如果孩子null或undefined返回null或undefined而不是一個數(shù)組。

React.Children.forEach

React.Children.forEach(children, function[(thisArg)])

像React.Children.map()但不返回數(shù)組。

React.Children.count

React.Children.count(children)

返回組件的總數(shù)children，等于回調(diào)傳遞給map或forEach將被調(diào)用的次數(shù)。

React.Children.only

React.Children.only(children)

驗證children只有一個子（一個React元素）并返回它。否則，此方法拋出。

注意：   React.Children.only()不接受返回值，React.Children.map()因為它是一個數(shù)組而不是React元素。

React.Children.toArray

React.Children.toArray(children)

children以分配給每個子項的鍵的平面數(shù)組形式返回不透明的數(shù)據(jù)結(jié)構(gòu)。如果你想在你的渲染方法中操作子集合，這很有用，特別是如果你想在重新排序或切片this.props.children之前將其傳遞下來。

注意：   React.Children.toArray()在展平子列表時，更改鍵以保留嵌套數(shù)組的語義。也就是說，toArray為返回數(shù)組中的每個鍵添加前綴，以便將每個元素的鍵范圍限定為包含它的輸入數(shù)組。