ReactDOM 在另一个渲染树中渲染一个 React 组件？

Question

我偶然发现了一些有效但没有记录的东西，我希望有人解释一下是否应该避免。

设置：非反应应用程序在几个地方呈现各种反应组件。

我注意到有几个组件执行以下操作：

function Foo(props){
    return <div>
        Some content
        <div id="placeholder"></div>
    </div>
}

ReactDOM.render(<Foo/>, domRef)

应用程序中的其他位置 ReactDOM.render(<Bar/>, document.getElementById("placeholder"))。 “占位符”是由 <Foo /> 组件呈现的 dom 元素。

我在 React 文档和 Stackoverflow 中找不到任何描述如何/是否应该工作的内容。或者如果它应该完全避免。任何有关该主题的信息都将不胜感激。