在两个兄弟的React.js组件之间传递数据

我想要做的就是将每个未经修改的参数从CardSearch字段传递给RunOnServer按钮,但如果这很简单,我会被诅咒.根据这个,我可以使用this.state.var作为道具,但是当编译代码时,这样做给了我'undefined.state.var'.React的官方文档不是很好; 他们只是告诉我自己去Flux,这看起来很糟糕......我不需要一个全新的架构来将一个简单的变量从一个组件传递到另一个组件.

我也尝试在正在进行渲染的文件中创建局部变量,但是它们作为道具传递给组件,并且您无法修改组件中的道具.

我创建了一个jsfiddle,其中包含如何使用父组件在两个组件之间共享变量的示例.

class Parent extends React.Component {
    constructor(props) {
        super(props);
        this.state = {shared_var: "init"};
    }

    updateShared(shared_value) {
        this.setState({shared_var: shared_value});
    }

    render() {
        return (
            

                
                
                
 The shared value is {this.state.shared_var} 
            
        );
    }
}

class CardSearch extends React.Component {
    updateShared() {
        this.props.updateShared('card');
    }

    render() {
        return (
            
            card
            
        );
    }
}

class RunOnServer extends React.Component {
    updateShared() {
        this.props.updateShared('run');
    }

    render() {
        return (
            
            run
            
        );
    }
}


ReactDOM.render(
  ,
  document.getElementById('container')
);