Question

比方说，我有以下三个组成部分：

ComponentA：呈现实际标记

ComponentB：将一些道具传递给ComponentA并渲染

ComponentC：将一些道具传递给ComponentB并渲染

我理解componentDidMount何时会触发直接输出标记的组件（当生成的标记附加到DOM时会触发），但是那些呈现非标记组件的组件会怎样？他们componentDidMount什么时候开火？

在上面的示例中，3个组件的componentDidMount的触发顺序是什么？

Answer 1

组件仍将调用componentDidMount，即使它们没有显式呈现标记。在您的示例中，

来自反应文档：

在安装发生之前立即调用componentWillMount（）。它在render（）...
之前调用

即使该组件将呈现为null，它仍然必须在经过正常生命周期之后将其解决，并且它仍然已经安装了＃39;它们仍然是组件，并以相同的方式运行。我喜欢考虑每个组件渲染标记，因为它有一个子组件（或者它返回null，不会影响生命周期）。

componentDidMount的顺序为A，B，C，其中包含以下内容：

ex：JSBIN

class A extends React.Component {
  componentDidMount() {
    console.log('A');
  }

  render() {
    return <div>AHHH IT IS A</div>
  }
}

class B extends React.Component {
  componentDidMount() {
    console.log('B');
  }

  render() {
    return <A someProps={'SomeProps'}/>
  }
}

class C extends React.Component {
  componentDidMount() {
    console.log('C');
  }

  render() {
    return <B someProps={'SomeProps'}/>
  }
}

ReactDOM.render(
  <C />,
  document.getElementById('root')
);

在React中，componentDidMount何时触发不直接呈现标记的组件？

1 个答案: