SOURCE

class Main extends React.Component{
  constructor(){
    super(...arguments)
    this.state = {
      themeColor:'#fff'
    }
  }
  render(){
    return (
    	<div>
        <Header/>
        <Content/>
      </div>
    )
  }
  getChildContext = ()=>{
    return {
      themeColor:this.state.themeColor
    }
  }
  static childContextTypes = {
    themeColor:PropTypes.string
  }
}

var Header = ()=>{
  return (
  	<div style={{backgroundColor:'pink'}}>
    	<div>Header</div>
    	<Title/>
    </div>
  )
}
var Content = ()=>{
  return (
  	<div style={{backgroundColor:'orange'}}>Content</div>
  )
}

class Title extends React.Component{
  constructor(){
    super(...arguments)
  }
  render(){
    console.log(this.context)
    return (
    	<div>{this.context.themeColor}</div>
    )
  }
  static contextTypes = {
    themeColor:PropTypes.string
  }
}
ReactDOM.render(<Main/>,document.getElementById('app'))

<div id="app">
  
</div>