我对反应有点陌生。我看到我们必须导入两个东西才能开始,React和ReactDOM,有人能解释一下区别吗?我正在阅读React文档,但它没有说。
当前回答
React: React是一个javascript库,旨在构建更好的用户界面。
React-DOM: React-DOM是React的一个免费库,它将React粘合到浏览器DOM上
我们正在使用React,每当我们使用render()或findDOMNode()等方法时,我们都在使用React- dom。
当我们看到React -native、React -art、React -canvas和React -three这样的包时,很明显,React的美丽和本质与浏览器或DOM无关。 为了更清楚地说明这一点,也为了更容易地构建更多React可以渲染的环境,他们将主要的React包分为两个:React和React -dom。
其他回答
react包保存了组件、状态、道具和所有react代码的react源。
React - DOM包顾名思义是React和DOM之间的粘合剂。通常,您只会将它用于一件事:使用ReactDOM.render()将应用程序挂载到index.html文件。
React和ReactDOM最近才被分成两个不同的库。在v0.14之前,所有的React功能都是React的一部分。这可能是一个困惑的来源,因为任何稍微过时的文档都不会提到React / ReactDOM的区别。
顾名思义,ReactDOM是React和DOM之间的粘合剂。通常,你只会用它做一件事:用ReactDOM.render()安装。ReactDOM的另一个有用特性是ReactDOM. finddomnode(),您可以使用它直接访问DOM元素。(在React应用程序中应该少用,但可能是必要的。)如果你的应用是“同构”的,你也可以在后端代码中使用ReactDOM.renderToString()。
对于其他的事情,有React。你使用React来定义和创建你的元素,用于生命周期钩子等,即React应用程序的核心。
React和React dom被分成两个库的原因是React Native的到来。React包含在web和移动应用程序中使用的功能。ReactDOM功能仅在web应用中使用。[更新:经过进一步的研究,很明显我对React Native的无知正在显现。现在,让React包在网络和移动设备上都通用似乎更像是一种愿望,而不是现实。React Native目前是一个完全不同的包。
查看发布v0.14的博文: https://facebook.github.io/react/blog/2015/10/07/react-v0.14.html
来自React v0.14 Beta发布公告。
当我们看到React -native、React -art、React -canvas和React -three这样的包时,很明显,React的美丽和本质与浏览器或DOM无关。 为了更清楚地说明这一点,也为了更容易地构建更多React可以渲染的环境,我们将主要的React包分为两个:React和React -dom。
从根本上说,React的想法与浏览器无关,它们只是渲染组件树的众多目标之一。React包允许开发人员从React包中删除任何不必要的代码,并将其移动到更合适的存储库中。
The react package contains React.createElement, React.createClass and React.Component, React.PropTypes, React.Children, and the other helpers related to elements and component classes. We think of these as the isomorphic or universal helpers that you need to build components. The react-dom package contains ReactDOM.render, ReactDOM.unmountComponentAtNode, and ReactDOM.findDOMNode, and in react-dom/server we have server-side rendering support with ReactDOMServer.renderToString and ReactDOMServer.renderToStaticMarkup.
这两段说明了v0.13的核心API方法的最终位置。
React: React是一个javascript库,旨在构建更好的用户界面。
React-DOM: React-DOM是React的一个免费库,它将React粘合到浏览器DOM上
我们正在使用React,每当我们使用render()或findDOMNode()等方法时,我们都在使用React- dom。
当我们看到React -native、React -art、React -canvas和React -three这样的包时,很明显,React的美丽和本质与浏览器或DOM无关。 为了更清楚地说明这一点,也为了更容易地构建更多React可以渲染的环境,他们将主要的React包分为两个:React和React -dom。
在v0.14之前,它们是主ReactJs文件的一部分,但在某些情况下,我们可能不需要两个,它们分开了,从0.14版本开始,这样如果我们只需要其中一个,我们的应用程序会因为只使用其中一个而变得更小:
var React = require('react'); /* importing react */
var ReactDOM = require('react-dom'); /* importing react-dom */
var MyComponent = React.createClass({
render: function() {
return <div>Hello World</div>;
}
});
ReactDOM.render(<MyComponent />, node);
React包包含:React。createElement,反应。createClass,反应。组件,反应。proptype,反应。孩子们
React-dom包包含:渲染,ReactDOM。unmountComponentAtNode ReactDOM。findDOMNode和react-dom/server,包括:ReactDOMServer。renderToString和ReactDOMServer.renderToStaticMarkup。
推荐文章
- 对象作为React子对象无效。如果要呈现子元素的集合,请使用数组
- Redux @connect装饰器中的“@”(at符号)是什么?
- 如何有条件元素和保持干燥与Facebook React的JSX?
- “你正在运行create-react-app 4.0.3,它落后于最新版本(5.0.0)”
- 道具更新状态在React Form中发生变化
- 在setInterval中使用React状态钩子时状态不更新
- 无法访问React实例(此)内部事件处理程序
- 如何滚动到底部的反应?
- 什么是React受控组件和不受控组件?
- npm犯错!代码UNABLE_TO_GET_ISSUER_CERT_LOCALLY
- 反应-显示加载屏幕,而DOM是渲染?
- 如何解决“不能在模块外使用导入语句”在开玩笑
- 是否有可能在react渲染函数中返回空?
- 使用Redux而不是Flux的缺点是什么
- 反应:为什么当道具改变时子组件不更新