在reactjs的子组件中处理udefined或null

我有一个父组件和一个子组件。说

Parent{
    render(){
       return(
          <Child1 />
          <Child2 list={this.state.value}/>
       )
    }
}

Parent{
render（）{
返回(
)
}
}

现在我的问题是，当我的控件到达Child2时，props.list将始终为空，当我从Child1单击我的selectbox时，状态将被填充，因此列表在Child2中

我面临的问题是，当控件第一次到达child2时，浏览器中的控制台显示列表未定义，它会中断，并且在我的child1中未呈现任何内容。如何处理此场景

也

---

是否有一种方法可以对child2设置一些条件，即如果仅加载状态，则应呈现该状态？

如果它抛出错误，即

props.list

为

null

，则需要在child2组件内通过检查

this.props.list

的值来处理这种情况。像这样：

class Child2 extends React.Component{

   render(){
       console.log(this.props.list)
       if(this.props.list)
           return <div>
                {this.props.list}
                /*other code*/
           </div>
       return null;
   }

}

---

哦，我犯了一个愚蠢的错误！在其他情况下没有返回任何内容，因此流中断。谢谢：）有时会发生这种情况，很高兴它帮助解决了您的问题：）

class Child2 extends React.Component{

   render(){
       console.log(this.props.list)
       if(this.props.list)
           return <div>
                {this.props.list}
                /*other code*/
           </div>
       return <div>No content</div>
   }

}