组件通信
2019-01-05 本文已影响1人
clumsy钧
demo链接
父传子组件主要是通过props
class App extends React.Component{
constructor(){
super()
this.state = {
result1: 0,
result2: 0
}
this.t0 = new Date()
}
success(x){
console.log(x)
console.log('兔子跑完了,用时')
let r1 = new Date() - this.t0
this.setState({
result1: r1
})
}
即把state里面的数据或者class里的方法传递给后代模板
需要注意的是方法的话需要bind this
render(){
return (
<div>
<div class="header">
<Time1 result={this.state.result1}/>
</div>
<Playground success={this.success1.bind(this)}/>
</div>
)
}
}
给孙组件传递同上
感觉跟之前写轮子用的单项数据流的思想相似
想来应该是vue借鉴的react