JSFiddle - React, Tailwind, and code Playground

HTML

<script src="https://cdnjs.cloudflare.com/ajax/libs/react/15.1.0/react.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/react/15.1.0/react-dom.js"></script>
<div id='container'></div>
<div id='overrideContainer'></div>

Babel + JSX

class Button extends React.Component {
  onClick() {
    alert(`${this.context.type}:${this.context.articleId}です`);
  }
  
  render() {
    return <button onClick={this.onClick.bind(this)}>{this.props.label}</button>;
  }  
}

Button.contextTypes = {
  type: React.PropTypes.string,
  articleId: React.PropTypes.number
};

class Section extends React.Component {
  render() {
    return <Button label={'Click'}/>;
  }
}

class Container extends React.Component {
  getChildContext() {
    return {type: this.props.type, articleId: this.props.articleId};
  }
  
  render() {
    return <Section/>;
  }
}

Container.childContextTypes = {
  type: React.PropTypes.string,
  articleId: React.PropTypes.number
};

class OverrideSection extends React.Component {
  getChildContext() {
    return {type: 'Override'};
  }
  
  render() {
  	return <Section/>;
  }
}

OverrideSection.childContextTypes = {
  type: React.PropTypes.string,
};

class OverrideContainer extends React.Component {
  getChildContext() {
    return {type: this.props.type, articleId: this.props.articleId};
  }
  
  render() {
    return <OverrideSection/>;
  }
}

OverrideContainer.childContextTypes = {
  type: React.PropTypes.string,
  articleId: React.PropTypes.number
};

ReactDOM.render(<Container type={'react'} articleId={1}/>, document.getElementById('container'));

ReactDOM.render(<OverrideContainer type={'flux'} articleId={2}/>, document.getElementById('overrideContainer'));