Невозможно отобразить компонент, полученный как prop.children в моем родительском компоненте

Question

Я не могу отобразить prop.children, в котором есть компонент.

// code for Layout component which could not render the prop.children
render(){
    return (
      <div>
        <Header/>
        <NavBar/>
        {props.children}
        <Footer/>
      </div>
    );
}

//code where I am trying to render the Layout component
  render() {
    const { user } = this.props;
    return (
      <React.Fragment>
        <Layout {...user}>
          <ListView user={user} />
        </Layout>
      </React.Fragment>
    );
  }

//P.S. ListView is another component which accepts user props

Я ничего не вижу для props.children при проверке DOM, хотя вижу, что Header, NavBar, Footer отображаются правильно.

Answer 1

В классе нужно добавить this для доступа к свойствам.

render(){
    return (
      <div>
        <Header/>
        <NavBar/>
        {this.props.children}
        <Footer/>
      </div>
    );
}

Answer 2

Если вы видите в консоли TypeError, что props не определено, то внутри метода класса вам нужно использовать this.props.