javascript - 如何从 React 组件中渲染整个树？

Question

我正在构建一个高阶组件，我希望它能够渲染出所有组合组件的子组件，以及它们的子组件，一路向下。

但是，当我调用 render() 时，它只渲染组件的子组件，而不渲染组件的子组件的子组件。

如何将其一直向下渲染？

这是一些代码:

export default ComposedComponent => {
  class HoC extends ComposedComponent {
    render() {
      console.log(super.render())
    }
  }

  return HoC
}

Answer 1

你永远不会手动调用渲染。初始化时以及每次 props 和 state 发生变化时，都会自动调用 Render。当在一个元素上调用 render 时，它的所有子元素也会被调用。

此外，不要使用继承。 React 组件扩展 React.Component，它们从不扩展其他组件。