Ich bin ein bisschen neu zu reagieren. Ich sehe, wir müssen zwei Dinge importieren, um loszulegen, React
und ReactDOM
kann jemand den Unterschied erklären. Ich lese die React-Dokumentation durch , aber es heißt nicht.
Ich bin ein bisschen neu zu reagieren. Ich sehe, wir müssen zwei Dinge importieren, um loszulegen, React
und ReactDOM
kann jemand den Unterschied erklären. Ich lese die React-Dokumentation durch , aber es heißt nicht.
React und ReactDOM wurden erst kürzlich in zwei verschiedene Bibliotheken aufgeteilt. Vor Version 0.14 war die gesamte ReactDOM-Funktionalität Teil von React. Dies kann zu Verwirrung führen, da in leicht veralteten Dokumentationen die Unterscheidung zwischen React und ReactDOM nicht erwähnt wird.
Wie der Name schon sagt, ist ReactDOM der Klebstoff zwischen React und dem DOM. Oft verwenden Sie es nur für eine einzige Sache: Montage mit ReactDOM.render()
. Eine weitere nützliche Funktion von ReactDOM ist ReactDOM.findDOMNode()
die, mit der Sie direkten Zugriff auf ein DOM-Element erhalten. (Etwas, das Sie in React-Apps sparsam verwenden sollten, das jedoch erforderlich sein kann.) Wenn Ihre App "isomorph" ist, würden Sie sie auch ReactDOM.renderToString()
in Ihrem Back-End-Code verwenden.
Für alles andere gibt es React. Sie verwenden React, um Ihre Elemente zu definieren und zu erstellen, für Lifecycle-Hooks usw., dh den Mut einer React-Anwendung.
Der Grund, warum React und ReactDOM in zwei Bibliotheken aufgeteilt wurden, war die Ankunft von React Native. React enthält Funktionen, die in Web- und mobilen Apps verwendet werden. Die ReactDOM-Funktionalität wird nur in Web-Apps verwendet. [ UPDATE: Nach weiteren Recherchen ist klar, dass meine Unkenntnis von React Native zeigt. Das React-Paket für Web und Mobile gemeinsam zu haben, scheint derzeit eher ein Anspruch als eine Realität zu sein. React Native ist derzeit ein völlig anderes Paket.]
Siehe den Blog-Beitrag zur Ankündigung der Version v0.14: https://facebook.github.io/react/blog/2015/10/07/react-v0.14.html
Aus der Ankündigung der Beta-Version von React v0.14 .
Wie wir bei Pakete aussehen
react-native
,react-art
,react-canvas
, undreact-three
, es ist deutlich geworden , dass die Schönheit und das Wesen nichts Reagieren hat mit Browsern oder dem DOM zu tun.Um dies klarer zu machen und es einfacher zu machen, mehr Umgebungen zu erstellen, in die React rendern kann, teilen wir das Hauptreaktionspaket in zwei Teile: React und React-Dom.
Grundsätzlich hat die Idee von React nichts mit Browsern zu tun, sie sind einfach eines von vielen Zielen, um Bäume von Komponenten zu rendern. Mit dem ReactDOM-Paket konnten die Entwickler nicht wesentlichen Code aus dem React-Paket entfernen und in ein geeigneteres Repository verschieben.
Das
react
Paket enthältReact.createElement
,React.createClass
undReact.Component
,React.PropTypes
,React.Children
und die andere , um Elemente und Komponenten - Klassen im Zusammenhang Helfer. Wir betrachten diese als isomorphe oder universelle Helfer, die Sie zum Erstellen von Komponenten benötigen.Das
react-dom
Paket enthältReactDOM.render
,ReactDOM.unmountComponentAtNode
undReactDOM.findDOMNode
, und inreact-dom/server
wir serverseitige Rendering - Unterstützung haben mitReactDOMServer.renderToString
undReactDOMServer.renderToStaticMarkup
.
In diesen beiden Absätzen wird erläutert, woher die wichtigsten API-Methoden stammen v0.13
.
ReactDOM
- facebook.github.io/react/blog/2016/11/16/react-v15.4.0.htmlVor v0.14 waren sie Teil der Hauptdatei von ReactJs, aber da wir in einigen Fällen möglicherweise nicht beide benötigen, trennen sie sie und es beginnt mit Version 0.14. Wenn wir nur eine davon benötigen, wird unsere App aufgrund von kleiner mit nur einem von denen:
Das React- Paket enthält: React.createElement, React.createClass, React.Component, React.PropTypes, React.Children
Das React-Dom- Paket enthält: ReactDOM.render, ReactDOM.unmountComponentAtNode, ReactDOM.findDOMNode und React-Dom / Server, einschließlich ReactDOMServer.renderToString und ReactDOMServer.renderToStaticMarkup.
quelle
Das ReactDOM-Modul stellt DOM-spezifische Methoden bereit, während React über die Kernwerkzeuge verfügt, die von React auf verschiedenen Plattformen (z. B. React Native) gemeinsam genutzt werden sollen.
http://facebook.github.io/react/docs/tutorial.html
quelle
Es sieht so aus, als hätten sie React in
react
undreact-dom
Pakete getrennt, sodass Sie den DOM-bezogenen Teil nicht für Projekte verwenden müssen, in denen Sie ihn in nicht DOM-spezifischen Fällen verwenden möchten , wie hier https: // github.com/Flipboard/react-canvas, wo sie importierenWie du siehst. Ohne
react-dom
.quelle
Um es genauer zu machen: Reagieren ist für die Komponenten und React-Dom dient zum Rendern der Komponenten im DOM. 'React-Dom' fungiert als Klebstoff zwischen Komponenten und DOM. Sie verwenden die render () -Methode des React-Dom, um Komponenten im DOM zu rendern, und das ist alles, was Sie wissen müssen, wenn Sie damit beginnen.
quelle
Das
react package
enthält diereact source
for-Komponenten, den Status, die Requisiten und den gesamten Code, der reagiert.Das
react-dom
Paket ist, wie der Name schon sagt, dasglue between React and the DOM
. Oft werden Sie es nur für eine einzige Sache verwenden :mounting your application to the index.html file with ReactDOM.render()
.Warum sie trennen?
Das
reason
React und das ReactDOM wurden aufgrund der Ankunft von in zwei Bibliotheken aufgeteiltReact Native (A react platform for mobile development)
.quelle