React编程实战-父子组件传值
本文章知识点均来自 jspang.com
本节介绍React 父子组件如何传值。
return <XiaojiejieItem
service={item}
deleteService = {this.deleteService}
key={index + item}
/>
service ,deleteService 在XiaojiejieItem.js中 直接通过 this.props.service 拿到对应的值。其中函数有必要说一下。
方法是使用箭头函数的形式定义的，其实它帮助我们简化了一个步骤
deleteService = index => {
let newServiceList = this.state.serviceList;
newServiceList.splice(index, 1);
this.setState({
serviceList: newServiceList
})
}
//相当于代码中
class Foo {
constructor(){
this.a = ()=>{}
}
}
所以不需要bind的形式，显示的绑定this。
return <XiaojiejieItem
service={item}
deleteService = {this.deleteService.bind(this,index)}
key={index + item}
/>
前后两者的效果一样，通过百度可知，两者的this的作用域不同。
就着bind 与箭头函数的问题，引发了一个react性能的问题。目前是初步学习react，后面再去了解渲染性能的问题。
