react componentDidMount时机问题

Question

componentDidMount是组件确实渲染成了dom后触发，如果我在这时候append一个绝对定位top0的有颜色的div，预期效果应该是先显示react组件，后立马显示红色div但是实际是直接显示红色div了，都没有闪一下的效果，这是为何？class App extends Component {  constructor(){    super();  }  componentDidMount() {    const div=document.createElement('div');    div.style='position:absolute;height:100px;width:100vw;background:blue;top:0';    document.body.appendChild(div)  }  render(){      return (      <div style={{background:'red'}}>hello world</div>    )  }}

Answer 1

同1楼，这个过程肉眼是看不出来的。就想同理如果在这个生命在后期中调用api来获取数据，实际是调用了2次，但是在浏览器中，是根本看不出来的。

Answer 2

你为什么会觉得现代计算机有这么慢？
想看效果自己用setTimeout设置延迟。

Answer 3

render部分写法有误

render() {

    return (

      <div style={{background:'red'}}>hello world</div>

    )

 }

现在应该可以先看到红色，然后再看到蓝色了