有没有办法告诉如果没有找到动态创建div的反应

时间:2016-03-22 22:11:37

标签: dom reactjs dynamic-html virtual-dom

新的反应,我想知道是否有任何解决方法可以解决此错误:

_registerComponent(...): Target container is not a DOM element.

编辑我要做的是:

我有一个反应函数,如:

ReactDOM.render(React.createElement(someFunction,{data:someData}),document.getElementById('someID')

生成dom之类的:

<span>
    <ul data-reactid='...'>blahhh</ul>
    <div data-reactid='...'>
        <div id='some-id1' data-reactid='...'>blahhh</div>
        <div id='some-id2'data-reactid='...'>blahhhh</div>
    </div>
</span>

现在在前一个反应调用的下一行,我有其他功能正试图用上面创建的div做的事情:

ReactDOM.render(React.createElement(someOtherReactFunction, { somePram: 'ImParam'}), document.getElementById('some-id1'));

这给了我:

_registerComponent(...): Target container is not a DOM element.

但我可以看到它存在于DOM

那我该如何访问这个虚拟dom div?并加载一些内容?

P.S:我知道dangerouslySetInnerHtml的方法,但寻找更好的方法

1 个答案:

答案 0 :(得分:4)

它只是javascript。是的你可以创建div。您只需在一些dom元素上注册一次即可加载所有应用。在React应用程序加载后你应该避免触摸DOM,因为React以非常有效的方式完成它,但它并不意味着它无法触及它。在加载React应用程序之前,如果你必须检查app容器是否存在,你可以使用这样的代码:

if (!document.getElementById("app")) {    
    var div = document.createElement("div");
    div.id = 'app';
    document.body.appendChild(div);
}

ReactDOM.render(<App />, document.getElementById('app'));