Home > Article > Web Front-end > How to dynamically add nodes in react
How to dynamically add nodes in react: 1. Display the pop-up box through the "KmcDialog.showInstance = function(properties) {...}" method; 2. Use "KmcDialog.showInstance({isShow: true}) ;KmcDialog.removeInstance();" method can be called directly where needed.
The operating environment of this tutorial: Windows 10 system, react18.0.0 version, Dell G3 computer.
How to dynamically add nodes in react?
React-Dynamic Insertion of Node Components
After introducing the component, you can insert the display component by calling it
/**********组件KmcDialog************/ /** * 显示弹框 */ KmcDialog.showInstance = function(properties) { if (!document.getElementById("KmcDialog")) { let props = properties || {}; let div = document.createElement('div'); div.setAttribute('id', 'KmcDialog'); document.body.appendChild(div); ReactDOM.render(React.createElement(KmcDialog, props), div); } } /** * 删除弹框 */ KmcDialog.removeInstance = function() { if(document.getElementById("KmcDialog")) { document.getElementById('KmcDialog').remove(); } }
When you need to use Local direct call:
KmcDialog.showInstance({ isShow: true }); KmcDialog.removeInstance();
Recommended learning: "react video tutorial"
The above is the detailed content of How to dynamically add nodes in react. For more information, please follow other related articles on the PHP Chinese website!