ReactJS：火法当组件被渲染

Question

我得到ReactJS一个一般性的问题：

是否可以立即启用的方法，所有的JSX组件（<div> components </div>）被渲染成功？所以如果有些只是在某些条件下呈现的，我是否可以在所有条件都为true的情况下尽快开火。

我怎么会检查是否一切都得到了成功地呈现？

Answer 1

有一个生命周期方法componentDidMount将反应呈现组件后立即被调用，它会被调用一次，只有在初始渲染后，我认为你可以使用该方法。

作为每DOC：

componentDidMount（）后的成分是 安装被立即调用。需要DOM节点的初始化应该放在这里。如果您 需要从远程端点加载数据，这是一个好地方 实例化网络请求。在此方法中设置状态将会触发重新渲染。

关于第二疑问句：

正进行渲染元素的一些条件的基础上，我假设你正在使用某种形式的布尔或检查数组的长度，所以有生命周期方法componentWillUpdate，它将在该方法内部重新呈现组件（它不会在初始呈现中调用）之前被调用，您可以检查所有条件并在所有条件为真时调用任何方法。 所以，只要你做setState它会被调用，你可以把逻辑放在这里。

Answer 2

这只是一个骨架，但它应该帮助你去，你要寻找的解决方案：

type ChildProps = { 
    onUpdated:() => void; 
} 

class MyChildComponent extends React.component<ChildProps, void> { 
    componentDidUpdate() { 
     this.props.onUpdated(); 
    } 

    render() { 
     ... 
    } 
} 

class MyComponent extends React.Component<void, void> { 
    private childCount: number; 
    private updated: number; 

    constructor() { 
     this.childCount = 2; 
    } 

    render() { 
     this.updated = 0; 

     return (
      <div> 
       <MyChildComponent onUpdated={ this.childUpdated.bind(this) } /> 
       <MyChildComponent onUpdated={ this.childUpdated.bind(this) } /> 
      </div> 
     ); 
    } 

    private childUpdated() { 
     this.updated++; 
     if (this.updated === this.childCount) { 
      // do something... 
     } 
    } 
}