React组件之间的传值

父组件传值给子组件，是通过属性传值,子组件接收父组件传过来的值，是通过this.props.xxx

image.png image.png

• 注意，当项目复杂的时候，我们在绑定方法的时候，尽量不要在render函数里去通过bind改变this指向，会对性能产生影响，通常的做法是在constructor函数里，进行this的绑定

  
  image.png

子组件调用父组件的方法去改变父组件的数据，前提是，父组件要先把自己的方法通过一个属性传递给子组件

image.png

• 子组件通过this.props.xxx来调用父组件传递过来的方法。同时也可以把子组件接收到的数据，传递给这个方法。

  
  image.png

• 但是这里有一个问题，就是this.props.deleteItem调用父组件传递过来的方法的时候，实际上调用的是this.handleItemDelete，而这个this是指向子组件本身的，子组件是没有这个handleItemDelete方法的，解决方法就是父组件传方法的时候，要先把this绑定为父组件本身。

  
  image.png

• 新版react里，setState方法的使用，之前我们是在setState里直接接收一个对象，现在我们可以在setState方法里传一个函数

  
  image.png

• 如果这个过程中报错，可以把值在setState外部做一个保存，在去通过setState修改值

  
  image.png