React 동적 증가compoent

동적으로 HTML 페이지에 구성 요소를 추가합니다.
보통

var balabalaba = React.createClass({
    render:function() {
        return (
            

        )
    }
})

var new_compoent = React.createElement(balabalaba);
ReactDOM.render(new_compoent, document.getElementById("body"));

这样的问题时，如果需要添加多个com就会出现覆盖问题，因为ReactDOM会将new_compoent覆盖掉父组件原有的组件。
如果此时用
document.getElementById("body").append(new_compoent)
同样也有问题，因为new_compoent目前还没有渲染，无法添加到DOM中。

为了解决上述问题，想了一个极其愚蠢的方法，那就是用append添加一个空的div，然后再将new_compoent渲染到这个空的div中。能够解决问题，但是依然感觉很蠢。

var newDIV = document.createElement('div');
var desktop = document.getElementById('body');
desktop.appendChild(newDIV);
ReactDOM.render(new_compoent, newDIV);

PS: 정확한 방법은 틀림없이 이렇게 하는 것이 아니지만, 나는 모른다. 그럼 먼저 이렇게 하자.정확한 방법이 있으면 알려주세요. 감사합니다!