title: React Redux reducer is not getting triggered
body: <p>I am not able to understand why reducer is being called in one case and not in another case. The footer component is given below.</p>
  
  <p>File <code>Footer.jsx</code></p>
  
  <pre><code>import React from 'react';
  import {bindActionCreators} from 'redux';
  import {connect} from 'react-redux';
  import './Footer.scss';
  import * as footerActions from '../../redux/actions/footer';
  
  const mapStateToProps = (state) =&gt; {
    return state;//{state: state, footerState: getFooterData(state)};
  };
  
  // Footer component is aware of only footer actions
  const mapDispatchToProps = (dispatch) =&gt; {
    return {
      actions: bindActionCreators(footerActions, dispatch)
    };
  };
  
  var Footer = React.createClass({
    propTypes:{
      state: React.PropTypes.object,
      actions: React.PropTypes.object
    },
    componentWillMount() {
      this.props.actions.changeLanguage("dutch");//&lt;-- This calls reducer and changes language
    },
    changeLang(language) {
      this.props.actions.changeLanguage("spanish");//&lt;--- This doesn't calls reducer
    },
    render() {
      var that = this;
      return (
        &lt;div className="footer"&gt;
          &lt;div onClick={that.changeLang.bind(that, 'english')}&gt;English&lt;/div&gt;
          &lt;div onClick={that.changeLang.bind(that,'german')}&gt;German&lt;/div&gt;
        &lt;/div&gt;
      );
    }
  });
  export default connect(mapStateToProps, mapDispatchToProps)(Footer);
  </code></pre>
  
  <p>actions file <code>footer</code></p>
  
  <pre><code>export const LANGUAGE_CHANGE  = 'LANGUAGE_CHANGE';
  
  export function changeLanguage(data, context) {
    return {
      type: LANGUAGE_CHANGE,
      data
    };
  }
  </code></pre>
  
  <p>Reducer file <code>footer</code></p>
  
  <pre><code>import { LANGUAGE_CHANGE } from '../actions/footer';
  
  export default function footer(state = {}, action) {
    switch (action.type) {
      case LANGUAGE_CHANGE:
        debugger;
        return  Object.assign({}, state, {language:action.data});
      default:
        return state;
    }
  }
  </code></pre>
  
  <p>In <code>footer.jsx</code> component code, dispatching  <code>LANGUAGE_CHANGE</code> action from <code>componentDidMount</code> method successfully calls <code>footer</code> reducer but, reducer is not called when <code>LANGUAGE_CHANGE</code> action dispatched from <code>changeLang</code> method. Not able to figure out what is going wrong ? Help Appreciated.</p>