react 组件传值 （父传子）

<div id="out"></div>



<script type="text/babel">
//父传子   子组件获取父组件数据
var Child = React.createClass({
return(
<div>
<h2>子组件通过属性传值</h2>
<div>子组件获取父组件内容 {this.props.name}</div>
<div>子组件获取父组件内容{this.props.val}</div>
<div>input   {this.props.inputval}</div>
</div>
)
}
})
var Father = React.createClass({
getInitialState:function(){  //设置默认状态值
return{
message:"父组件数据",
inputVal:''
}
},
change:function(e){
console.log(e.target.value)
this.setState({
inputVal:e.target.value
})
},
render:function(){
return(
<div>
<h1>父组件</h1>
<input type="text" onChange={this.change}/>
<Child name="ouyang" inputval={this.state.inputVal} val={this.state.message}/>
</div>
)
}
})
ReactDOM.render(<Father/>,document.getElementById('out'))
</script>