首页 > 解决方案 > 如何在反应中创建和删除组件?

问题描述

我在使用 reactDom 创建和删除组件时遇到问题

我正在尝试从其类中销毁弹出组件,但它给了我一个警告

// file: successfull.js
mostrarPopUp(enterprise) {
        let contenedor = document.getElementById('popup');
        ReactDOM.render(<Popup empresa={enterprise} />, contenedor);
}

// file: popup.js
closeComponent() {
        console.log("Destruir componente");
        let element = document.getElementById("contenedorpop");
        let container = ReactDOM.findDOMNode(element);
        ReactDOM.unmountComponentAtNode(container);
}

我有下一个警告

Warning: unmountComponentAtNode(): The node you're attempting to unmount was rendered by React and is not a top-level container. You may have accidentally passed in a React root node instead of its container.

标签: javascriptreactjscomponentsreact-dom

解决方案


您应该根据布尔值呈现它,即

 { this.state.shouldIRender === true ?  <Popup empresa={enterprise} /> : null }

并在 closeComponent

closeComponent() {
   this.setState({
    shouldIRender: false
   })
}

推荐阅读