2016-09-29 81 views
6

我使用ES6 babel反應,現在對於新版本反應,反應DOM不再是它的一部分。我對以下代碼的懷疑是,它是否是第一行要求?因爲無處我需要React,但最後一行我需要ReactDOM。反應與反應DOM混淆

const React = require('react') 
const ReactDOM = require('react-dom') 

const App =() => { 
    return (
     <div className='app-container'> 
      <div className='home-info'> 
       <h1 className='title'>sVideo</h1> 
       <input className='search' type='text' placeholder='Search' /> 
       <button className='browse-all'> or Browse All</button> 
      </div> 
     </div> 
    ) 
} 

ReactDOM.render(<App />, document.getElementById('app')) 
+2

是的,它是必需的。返回語句被轉譯爲'React。createElement'和其他語句。 ReactDOM也依賴於React。 – Li357

回答

9

從版本0.14起的反應分爲兩部分:反應ReactDOM。您正在使用ReactDOM to render you HTML element。因此,您在組件中對import ReactDOM絕對有意義。但是就React而言,雖然您並未直接使用React,但它是間接使用的,因爲無論您在您的return statement will be transpiled into React.createElement函數中編寫哪個函數,都會創建實際的DOM元素。

現在你可以看到這一點,如果你省略反應。在你的代碼,你會看到一個錯誤,

反應不存在

,它會給你React is not recognised in React.createElement.希望你瞭解它。

1

ReactDOM文檔:

這個包作爲DOM相關的渲染通道的入口點。它的目的是與同構React配對,它將作爲對npm的反應而發運。

因此,您的ReactDOM專門用於渲染的DOM相關路徑。這使用來與React包本身緊密結合,但React中內置的DOM已被棄用。

現在,Facebook將ReactDOM單獨作爲自己的軟件包發佈,因此,如果您計劃渲染任何React,則需要將其包含在您的應用中。而且你也一定需要React本身 - ReactDOM只是DOM方面。


這是reddit post that explains the separation from React and ReactDOM

React團隊正致力於將所有與DOM相關的東西提取到名爲ReactDOM的單獨庫中。 0.14是圖書館分裂的第一個版本。

小有趣的事實,因爲他們希望支持向後兼容性,他們不停地做出反應的內部DOM,但使用它in a funny way震懾人心。

0

他們是從0.14版本分開,對於任何反應的項目,則需要包括,ReactDOM是鋪設在陣營,並陣營,沒有ReactDOM不能被渲染到DOM ,所以答案是很大的是的