在最初的reactdom.render之后,当componentdidmount方法启动时,整个dom是否准备好了?

请考虑以下代码:

import React from "react";
import ReactDOM from "react-dom";

class CompA extends React.Component {
  componentDidMount() {
    console.log("a");
    debugger;
  }
  render() {
    return <div>Component A</div>;
  }
}

class CompB extends React.Component {
  componentDidMount() {
    console.log("b");
  }
  render() {
    return <div>Component B</div>;
  }
}

class CompC extends React.Component {
  componentDidMount() {
    console.log("c");
  }
  render() {
    return <div>Component C</div>;
  }
}

class App extends React.Component {
  componentDidMount() {
    console.log("App");
  }

  render() {
    return (
      <div id="top-level-component">
        <h1>Hello!</h1>
        <CompA />
        <CompB />
        <CompC />
      </div>
    );
  }
}

ReactDOM.render(<App />, document.getElementById("root"));

Link to Codesanbox

我有三个问题:

问题1

在初始渲染中 ReactDOM.render() ,只有一个追加操作发生(即 #top-level-component dom元素已经包含了它的所有子元素,它被附加到 #root dom元素),而不是附加 #顶级组件 到 α根 ,然后将其子级的dom元素附加到 #顶级组件 dom元素。对的?

问题2

这个 componentDidMount 组件的方法在发生单次追加操作后按顺序从下到上触发,这意味着控制台将记录

a
b
c
App

这意味着当 组件 属于 CompA 火灾, 整体 dom已经准备好了,如果有必要,它可以查询dom中的一个兄弟节点。对的?

问题3

遵循上述规定,它是否通常是安全的(意思是在部件安装之后,在初始安装之后 reactdom.render() )假设当我们有一些同级组件时, 组件 激发其他兄弟的dom表示已被刷新到dom中?