React父子组件传参及容易混淆的问题

React是前端主流框架中的一种，由于它本身并不像Vue那样使用Object.defineProperty或者Proxy对很多数据做了劫持，以此来完成双向数据绑定，而是做了一个逻辑层到渲染层的单向数据流绑定，使得他性能更为优越，再加上本身和原生JS代码的契合，让它更为灵活

接下来介绍一下React父子组件传参的方式

父传子：

• 父组件通过属性=值的方式来传递给子组件数据
• 子组件通过props参数获取父组件传递过来的

          父组件：

constructor(){
   super()
   this.state = {
       arr: [1,2,3,4,5],
       title: 'JENNIE'
   }
   console.log('constructor')
}
render(){
    console.log('render')
    const { arr , title } = this.state
    return (
            <>
                <ComponentComm arr={arr} title={title}>						             </ComponentComm>
            </>
    )
}

            子组件：

 constructor(props){
    // 我们可以通过props来接收父组件传过来的参数
    super(props)
    this.state = {}
  }
  render