Reactjs ReactDOM.render是否改为insertBefore而不是replace？（请说明原因，CSS相邻同级选择器）

目前，我正在与React合作：

 ReactDOM.render(<HelloMessage name="John" />, mountNode);

但是，myComponent没有相邻的同级，因为我替换了目标elmeent的内容，所以失败了。因此，我的解决方法是在每次渲染时，在父节点上设置属性：

    if (this.refs.myc) {
        this.state.profiles.length > 0 ? this.refs.myc.parentNode.setAttribute('data-state', 'open') : this.refs.myc.parentNode.removeAttribute('data-state'); // my ugly work around, put the data-state attribute on the parentNode of mountNode
    }

但是，这并不高效，因为它不是在虚拟dom上设置的，而是每次在dom上设置的。所以我想把我的组件作为主体中的第一个子元素插入，这样我的样式表就可以工作了

---

这是工作摆弄和变通方法-

你解决了这个问题吗？你肯定可以在不同的地方安装它

const newChildNode = document.createElement('DIV')
newChildNode.id = 'new-child-node'
document.body.insertBefore(newChildNode, document.getElementById('root'))

ReactDOM.render(<App />, newChildNode)

const newChildNode=document.createElement（'DIV'）
newChildNode.id='new child node'
document.body.insertBefore（newChildNode，document.getElementById（'root'））
render（，newChildNode）

不要认为有什么出路，您是否考虑过在mountNode之前插入一个元素，然后将其传递进来？不，这是不可能的。也许你需要这样的结构——为什么你真的想这么做？有很多方法可以解决这个问题，但是你需要提供更多关于这个用例的信息。你有没有理由不在一个React应用程序中维护所有DOM，而是将其以React应用程序和内容标签的形式划分为菜单？如果您像应该的那样将所有内容都保留在React中，那么在顶级组件中维护状态并将其作为道具传递给菜单子组件或内容子组件将非常容易。因此，每件事都是反应性地同步的，反应会为你照顾好它。哦，这太糟糕了。我不是Firefox插件的专家，但是你发明的解决方法对我来说很好，我不知道如何替换现有节点的内容。这是一种聪明的方式，但也是附加的+1尽管如此。

const newChildNode = document.createElement('DIV')
newChildNode.id = 'new-child-node'
document.body.insertBefore(newChildNode, document.getElementById('root'))

ReactDOM.render(<App />, newChildNode)