react和reactdom有哪些区别
这篇文章主要介绍“react和reactdom有哪些区别”,在日常操作中,相信很多人在react和reactdom有哪些区别问题上存在疑惑,小编查阅了各式资料,整理出简单好用的操作方法,希望对大家解答”react和reactdom有哪些区别”的疑惑有所帮助!接下来,请跟着小编一起来学习吧!
react和reactdom的区别是:ReactDom只做和浏览器或DOM相关的操作,例如“ReactDOM.findDOMNode()”操作;而react负责除浏览器和DOM以外的相关操作,ReactDom是React的一部分。
本教程操作环境:Windows10系统、react17.0.1版、Dell G3电脑。
react和reactdom有什么区别
ReactDom 只做和浏览器或DOM相关的操作,例如:ReactDOM.render() 和 ReactDOM.findDOMNode()。如果是服务器端渲染,可以 ReactDOM.renderToString()。React 不仅能通过 ReactDOM 和Web页面打交道,还能用在服务器端SSR,移动端ReactNative和桌面端Electron。
React 在v0.14之前是没有 ReactDOM 的,所有功能都包含在 React 里。从v0.14(2015-10)开始,React 才被拆分成React 和 ReactDOM。为什么要把 React 和 ReactDOM 分开呢?因为有了 ReactNative。React 只包含了 Web 和 Mobile 通用的核心部分,负责 Dom 操作的分到 ReactDOM 中,负责 Mobile 的包含在 ReactNative 中。
ReactDom是React的一部分。ReactDOM是React和DOM之间的粘合剂,一般用来定义单一的组件,或者结合ReactDOM.findDOMNode()来使用。更重要的是ReactDOM包已经允许开发者删除React包添加的非必要的代码,并将其移动到一个更合适的存储库。
e.g:
Web端React代码
import React from 'react';
import ReactDOM from 'react-dom';
const App = () => (
<div>
<h2>Hello React</h2>
</div>
)
ReactDom.render(<App/>, document.getElementById('root'));
移动端的ReactNative代码:
import React from 'react';
import {Text, View} from 'react-native';
const WelcomeScreen = () => (
<View>
<Text>Hello ReactNative</Text>
</View>
);
相同的是都需要import React from 'react'。
而Web应用需要import ReactDOM from 'react-dom';
Mobile应用需要import {Text, View} from 'react-native'
到此,关于“react和reactdom有哪些区别”的学习就结束了,希望能够解决大家的疑惑。理论与实践的搭配能更好的帮助大家学习,快去试试吧!若想继续学习更多相关知识,请继续关注编程网网站,小编会继续努力为大家带来更多实用的文章!
免责声明:
① 本站未注明“稿件来源”的信息均来自网络整理。其文字、图片和音视频稿件的所属权归原作者所有。本站收集整理出于非商业性的教育和科研之目的,并不意味着本站赞同其观点或证实其内容的真实性。仅作为临时的测试数据,供内部测试之用。本站并未授权任何人以任何方式主动获取本站任何信息。
② 本站未注明“稿件来源”的临时测试数据将在测试完成后最终做删除处理。有问题或投稿请发送至: 邮箱/279061341@qq.com QQ/279061341