美文网首页让前端飞前端React相关
React-动态插入节点组件

React-动态插入节点组件

作者: 墨_梵 | 来源:发表于2018-11-05 14:00 被阅读5次

    引入组件后,可以通过调用方式来插入显示组件

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

    在需要使用的地方直接调用:

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

    相关文章

      网友评论

        本文标题:React-动态插入节点组件

        本文链接:https://www.haomeiwen.com/subject/zslsxqtx.html