Missing documentation

I stumbled onto something that works but is not documented and I'd like to understand if it should be avoided.

The setup: Non react application renders various react components in few places.

I've noticed couple of components that do the following:

function Foo(props){
    return <div>
        Some content
        <div id="placeholder"></div>
    </div>
}
ReactDOM.render(<Foo/>, domRef)

Somewhere else in the application ReactDOM.render(<Bar/>, document.getElementById("placeholder")). The "placeholder" being the dom element rendered by the <Foo /> component.

I couldn't find anything in the React docs and Stackoverflow describing how/if this should work. Any light on the subject would be much appreciated.

I have also opened a this: https://stackoverflow.com/questions/66134211/reactdom-render-one-react-component-inside-the-render-tree-of-another

Bắt đầu với các ví dụ về ReactDOM.render được mô tả trong issue và đối chiếu chúng với tài liệu React hiện có. Xác định liệu việc render vào một phần tử DOM do một component khác tạo ra có được hỗ trợ hay nên tránh, sau đó ghi lại hướng dẫn và kiểm tra rằng trang đề cập đến trường hợp render lồng nhau được nêu ở đây.