Comment ajouter dynamiquement des nœuds en réaction

Comment ajouter dynamiquement des nœuds dans React : 1. Affichez la boîte de dialogue contextuelle via la méthode "KmcDialog.showInstance = function(properties) {...}" ; 2. Utilisez "KmcDialog.showInstance({isShow : true}) );KmcDialog.removeInstance" ();" peut être appelée directement si nécessaire.

L'environnement d'exploitation de ce tutoriel : système Windows 10, React version 18.0.0, ordinateur Dell G3.

Comment ajouter dynamiquement des nœuds en réaction ?

React - insérer dynamiquement des composants de nœud

Après avoir introduit le composant, vous pouvez insérer le composant d'affichage en appelant

/**********组件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();
    }
}

Appelez directement là où vous devez utiliser :

KmcDialog.showInstance({
    isShow: true
});
KmcDialog.removeInstance();

Apprentissage recommandé : "Tutoriel vidéo React"

Ce qui précède est le contenu détaillé de. pour plus d'informations, suivez d'autres articles connexes sur le site Web de PHP en chinois!