Skip to content

react 和 react-dom 是什么关系?

Posted on:2024年7月22日 at 10:12

reactreact-dom 是 React 库的两个主要部分,它们分别负责处理不同的事务。它们之间的关系可以理解为:

  1. react 这是 React 库的核心部分,包含了 React 的核心功能,如组件、状态、生命周期等。它提供了构建用户界面所需的基本构建块。当你编写 React 组件时,你实际上是在使用 react 包。

  2. react-dom 这是 React 专门为 DOM 环境提供的包,它包含了与浏览器 DOM 相关的功能。react-dom 提供了用于在浏览器中渲染 React 组件的方法,包括 ReactDOM.render。在 Web 开发中,react-dom 被用于将 React 应用渲染到浏览器的 DOM 中。

基本上,reactreact-dom 是为了分离 React 的核心功能,以便更好地处理不同的环境和平台。这种分离使得 React 更加灵活,可以适应不同的渲染目标,而不仅仅局限于浏览器环境。

在使用 React 开发 Web 应用时,通常会同时安装和引入这两个包:

npm install react react-dom

然后在代码中引入:

import React from "react";
import ReactDOM from "react-dom";

const App = () => {
  return <h1>Hello, React!</h1>;
};

ReactDOM.render(<App />, document.getElementById("root"));

在上面的例子中,react 库提供了 App 组件的定义,而 react-dom 库提供了 ReactDOM.render 方法,用于将组件渲染到 HTML 页面中。这种分工让 React 在不同平台上能够更灵活地适应各种渲染目标。

原文转自:https://fe.ecool.fun/topic/2839488b-8d7e-47ff-9c9a-c2631479183f