如何在ReactJs中卸载所有根级组件

Question

有没有办法在React中获取所有根元素？

我有一种情况，其中元素是通过ReactDOM.render在根上创建的，但是当我的组件卸载时，它们并没有被卸载。

我想获取AppContainer以外的所有元素，然后在我的组件上载时将其卸载，这可能吗？

Answer 1

用ReactDOM渲染的

根组件彼此之间并不了解。

要卸载不在卸载组件树中的组件，可以按照以下步骤进行操作：

const App1Component = <div>app1</div>;
const app1 = document.getElementById("app1")
ReactDOM.render(<App1Component/>, app1);

export class AppContainer extends React.Component {
  componentWillUnmount() {
    // ummount other components not in this tree
    if (app1) 
      ReactDOM.unmountComponentAtNode(app1);
  }
}

基本上，每当要卸载“主要”组件时，请与其他根元素DOM节点一起调用ReactDOM.unmountComponentAtNode。