1.父组件向子组件传值
(通过props来传值,这种应用,很多时候我们某个组件在不同的地方用到,但是就只是内容不一样,这样在调用组件就是父组件的时候给各自自己的值就好)
//子组件
class Es6cComponent extends React.Component{
constructor(props){
super(props);
}
render(){
return(
<div>
<div>{this.props.nameall}</div>
</div>
)
}
}
//父组件
class App extends React.Component{
render(){
return(
<div>
<Es6cComponent nameall="abc"/>
</div>
)
}
}
总结: 将父组件的值直接通过props传入子组件,子组件直接使用该值即可。
2.子组件给父组件传值 (回调函数)
总结: 将父组件的改变状态的方法传入子组件的props,绑定给子组件中的某些触发事件譬如按钮的点击,输入框输入等等,得到子组件的值或状态或动作再调用父组件的方法得到子组件中的值。
3、兄弟组件传值
总结: 事实上是将一些共同的状态存入一个更高的组件中存放着,从这个地方操作值和调用值。