「react-dom」的作用是將虛擬DOM渲染到文件中變成實際DOM；「react-dom」是react開發專案時需要使用的工具包，提供了DOM特定的方法，可以在應用程式的頂層使用，也可以作為React模型以外的特殊操作DOM的介面。
本教學操作環境：Windows10系統、react17.0.1版、Dell G3電腦。
在使用react開發網頁時，會下載兩個包，一個是react，一個是react-dom，其中react包是react的核心代碼， react-dom則是React剝離出的涉及DOM操作的部分。
react的核心思想是虛擬DOM，react包含了產生虛擬DOM的函數react.createElement，以及Component類別。當我們自己封裝元件時，就需要繼承Component類，才能使用生命週期函數等。而react-dom套件的核心功能就是把這些虛擬DOM渲染到文件中變成實際DOM。
react-dom是react開發專案時需要使用的工具包，是一種針對dom的平台實現，主要用於在web端進行渲染。 react-dom套件提供了DOM特定的方法，可以在應用程式的頂層使用，也可以作為React模型之外的特殊操作DOM的介面。
react-dom主要包含三個API：findDOMNode、unmountComponentAtNode 和 render。下面按觸發先後順序進行介紹。
1、render
render用於將React渲染的虛擬DOM渲染到瀏覽器DOM，一般在頂層元件使用。這個方法把元素掛載到 container 中，並且傳回 element 的實例（即 refs 引用），如果是無狀態元件，render 會傳回 null。當元件裝載完畢時，callback 就會被呼叫。其語法為：
render(ReactElement element,DOMElement container,[function callback])
例如：
import React from 'react'
import ReactDOM from 'react-dom'
import Router from './router'
import { Provider } from 'react-redux'
import store from './store'
// Provider react-redux的内容
ReactDOM.render(
<Provider store={store}>
<Router/>
</Provider>, document.getElementById('root'))2、findDOMNode
findDOMNode用於取得真正的DOM元素，以便對DOM節點進行操作。
在此之前，首先要知道：在React中，虛擬DOM真正被添加到HTML中轉變為真實DOM是在組件掛載（render()）後，故而我們可以在componentDidMount和componentDidUpdate這兩個方法中獲取。範例如下：
import { findDOMNode } from 'react-dom';
<Example ref={ node=>{ this.node = node} }> // 利用ref获取Example组件的实例
const dom = findDOMNode(this.node); // 通过findDOMNode获取实例对应的真实DOM注意：當涉及複雜操作時，還有很多元素DOM API可用，然而DOM操作會對效能產生很大影響，所以，應盡量減少DOM操作。
3、unmountComponentAtNode
unmountComponentAtNode用於執行卸載操作，執行在componentWillUnmount之前。
推薦學習：《react影片教學》
以上是react-dom有什麼作用的詳細內容。更多資訊請關注PHP中文網其他相關文章！
