使用createRoot()方法创建的react组件在调用ReactDOM.unmountComponentAtNode()方法卸载报错的解决方案

卸载直接挂载在index.html的顶级组件的时候出现以下两个报错：

警告：你正在一个容器上调用ReactDOM.unmountComponentAtNode()，该容器之前被传递给了ReactDOMClient.createRoot()。这是不支持的。您是想调用root.unmount()吗?

Warning: You are calling ReactDOM.unmountComponentAtNode() on a > container that was previously passed to ReactDOMClient.createRoot(). > This is not supported. Did you mean to call root.unmount()?

警告：您试图卸载的节点是由React呈现的，并且不是顶级容器。相反，让父组件更新它的状态并重新呈现，以便删除该组件。

Warning: unmountComponentAtNode(): The node you're attempting to unmount was rendered by React and is not a top-level container. Instead, have the parent component update its state and rerender in order to remove this component.

告诉你使用createRoot()方法创建的react组件不能被ReactDOM.unmountComponentAtNode()方法直接卸载，下面是要进行卸载的组件

const container = document.getElementById('root')
const root = createRoot(container)

通过以下步骤可以执行卸载

1.

export default root

2.

// 引入root的路径自己根据情况更改
import root from '../../index'

3.

//在要执行卸载的组件的方法中执行这个方法
root.unmount()

完事儿