ReactDOM 包及其用途

每個 React 開發人員都有使用外部庫的獨特方法。有些人試圖將它們的使用限制在核心要素上，而另一些人則幾乎所有東西都使用外部庫。

在今天的文章中，我們將討論 React 的基本庫之一，稱為 ReactDOM。這個包提供了在 React 應用程式中管理 DOM 渲染的必要方法。

React 中的 ReactDOM 包

結合通用的 React 庫，這個包是在 React 中構建動態應用程式所必需的。它提供了一個至關重要的 render() 函式，這是任何類元件的基本構建塊。

一般來說，這個包提供了與 DOM 互動的方法，使我們能夠有效地管理應用程式 DOM。以下是 ReactDOM 包中包含的最基本方法的列表：

• Render()
• findDOMNode()
• unmountComponentAtNode()
• hydrate()
• createPortal()

什麼是 DOM 和虛擬 DOM

本質上，DOM（文件物件模型的縮寫）是將網頁表示為物件。它提供了一個 API 來訪問、讀取或改變頁面的內容。

在 React 流行之前，JavaScript 開發人員使用諸如 jQuery 之類的庫來直接更改 DOM。手動 DOM 操作效率低下，因為瀏覽器會重新渲染整個頁面，即使對 DOM 的更改幾乎看不到。

React 之所以受歡迎，是因為它提供了一個虛擬 DOM，即 DOM 的任意副本，它可以跟蹤更改並一次更新實際 DOM。

這種方法效率更高，因此 Virtual DOM 至今仍是 React 的核心功能之一。ReactDOM 庫包含在 React 中與 DOM 互動的基本功能。

在 React 中安裝 ReactDOM

過去，ReactDOM 方法包含在泛型包中，但現在我們必須單獨匯入它們。首先，你必須選擇應用程式目錄並通過在命令列中輸入以下內容來安裝包：

npm install react-dom

然後就可以匯入了。如果你使用的是現代版本的 JavaScript，你可以使用 import 語句來做到這一點：

import ReactDOM from 'react-dom'

或者，如果你只需要匯入一個 render 方法，你可以像這樣匯入它：

import { render } from 'react-dom'

你可以使用以下模式匯入任何其他特定方法。