react傳值--父->子

react的的父子傳值並不難

1.在父組件中調用子組件
2.在子組件上綁定名稱(name)  寫入須要傳的值  

3.在子組件中就能夠取值了 語法:this.props.name

我爲了區分,綁定的名字是name1

父組件 

 

class ParentList extends React.Component{
				 constructor (){
					 super()
					 this.state = {
						 name:'parent',
						 age:50
					 }
				 }
				 render(){
					 let {name,age}=this.state;
					 return(
						<div>
							<p>我是{name},我今年{age}了</p>
							<Child name1={name} age1={age} />
						</div>
					 )
				 }
			 }複製代碼

子組件

class Child extends React.Component{ 
    render(){
	 return(
		<div>我是兒子,接手父親傳過來的值{this.props.name1}---{this.props.age1}</div>
		 )
    }
				 
}複製代碼

渲染

ReactDOM.render(
          <ParentList />,
          document.getElementById("my")
        );複製代碼