React中子组件向父组件传值

举例

父组件:

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;

关系图：