React组件之间的传值
2022-03-11 本文已影响0人
泡杯感冒灵
父组件传值给子组件，是通过属性传值,子组件接收父组件传过来的值，是通过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
