javascript - 如何在React中创建和删除组件?

标签 javascript reactjs components react-dom

我在使用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.

最佳答案

您应该根据 bool 值来渲染它,即

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

并在 closeComponent 中

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

关于javascript - 如何在React中创建和删除组件?,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/57403008/

相关文章:

javascript - 如何用 jQuery 检测一一点击间隔?

forms - React JS - 用动态子元素组成通用形式

reactjs - 当我从“用户”单击到“发布”时,React Router 中的重定向不起作用

javascript - Vue2错误 'classList'为空错误

search - joomla 1.5 搜索与自定义组件的集成?

javascript - 必须返回一个有效的 ReactComponent。您可能返回了未定义的数组或其他无效对象

javascript - 根据 javascript 中的数字/对象对数组或 json 进行排序

javascript - 重置 Ajax 表单提交上的 Select2 下拉菜单

javascript - 是否通过 AJAX 组件中包含的循环组件扩展 JSON 元素? - react JS

javascript - 使用 redux 依赖项发送 React 包