猿来是你三十而立,砥砺前行,不忘初心,勇闯猿类

react中父组件给子组件传值

子组件

state = {
	msg: 'a'
}
render(){
	return<h1>{this.state.msg}</h1>
}
setInfo = (val)=>{
//这里的val就是父组件通过调用这个方法,传的参数,在这里val的值为aaa
	this.setState({
		msg: val
	})
}

父组件

render(){
	return <div><Test ref="myTest">
	<button onClick={()=>this.show()}/>
	</div>
}
show = ()=>{
	this.refs.myTest.setInfo('aaa')
}

 

注意:在这里父组件通过点击按钮调用show方法,进而调用子组件中的一个setInfo方法,通过传参,而修改了子组件的的msg值。切记: 在react中如果要修改数据的话一定要使用setState()方法才可以。

 本文链接:https://blog.csdn.net/zsm4623/article/details/86594275

posted @ 2019-10-15 15:04  青瑟少年  阅读(2562)  评论(0编辑  收藏  举报