我创建了一个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 ( <div> <CardSearch shared_var={this.state.shared_var} updateShared={this.updateShared} /> <RunonServer shared_var={this.state.shared_var} updateShared={this.updateShared} /> <div> The shared value is {this.state.shared_var} </div> </div> ); }}class CardSearch extends React.Component { updateShared() { this.props.updateShared('card'); } render() { return ( <button onClick={this.updateShared} style={this.props.shared_var == 'card' ? {backgroundColor: "green"} : null} > card </button> ); }}class RunonServer extends React.Component { updateShared() { this.props.updateShared('run'); } render() { return ( <button onClick={this.updateShared} style={this.props.shared_var == 'run' ? {backgroundColor: "green"} : null}> run </button> ); }}ReactDOM.render( <Parent/>, document.getElementById('container'));
