#### 舉例
父組件:
~~~
var React = require('react');
import {render} from 'react-dom';
import {Router, Route, Link} from 'react-router';
import '../style/index.css';
import Headnav from './indexComponents/headnav.jsx';
import Content from './indexComponents/content.jsx';
import Footer from './indexComponents/footer.jsx';
var Index = React.createClass({
getInitialState: function () {
return {};
},
handleGet: function(val){
this.setState({test: val});
},
render: function () {
return (
<div className="main">
<Headnav />
<div>所傳的值：{this.state.test}</div>
<Content handleValue={this.handleGet.bind(this)}/>
<Footer />
</div>
);
}
});
module.exports = Index;
~~~
子組件
~~~
import React from 'react';
import {render} from 'react-dom';
import {Router, Route, Link} from 'react-router';
var Content = React.createClass({
getInitialState: function () {
return {testVal: 'Hello Runoob!'};
},
handAttribute:function(){
this.props.handleValue(this.state.testVal);
},
render: function () {
return (
<div className="content">
this is content
<input onChange={this.handAttribute}/>
</div>
);
}
});
module.exports = Content;
~~~
#### 關系圖：
