从react中的父dom节点中删除子组件

Remove a child component from parent dom node in react

本文关键字：删除 节点 组件 react dom      更新时间：2023-09-26

从安装组件的同一DOM元素中卸载组件。

ReactDOM.render(<SampleComponent />, document.getElementById('container'));

然后我们用卸载它

React.unmountComponentAtNode(document.getElementById('container'));

如果容器连接了两个或两个以上的组件，例如，如何卸载组件并将其重新连接到父容器

<div id="container">
   <SampleComponent1/>
   <SampleComponent2/>
</div>

我想根据SampleComponent2中的某个事件删除并重新附加SampleComponent2。

您应该让React根据您给它的道具来处理组件1和2。

例如，使用ES6和React 0.14纯组分：

const App = ({has2}) => 
  <div>
     <Component1 />
     {has2 && <Component2 />}
  </div>

如果has2是真的，它将显示Component2。只要has2发生变化，只需再次调用render，React即可完成其余操作。

相关文章：