title: React/Redux unable to set a state from a component
body: <p>I have a simple react-redux set up which is described below from which I want to set my state. However I am always getting undefined.</p>
  
  <blockquote>
    <p>DashBoard Component</p>
  </blockquote>
  
  <pre><code>class DashBoard extends React.Component {
  
      constructor(props) {
          super(props);
          this.state = {
            value: 'b',
            rooms: []
          };
      }
  
      render() {
        return (
           &lt;div onClick={this.handleChange}&gt;Click it&lt;/div&gt;
        )
      }
  
      handleChange = (value) =&gt; {
        this.setState({
          value: value,
        });
        axios.get('http://localhost:3001/rooms').
          then((res) =&gt; {
          this.props.setRooms(res.data.rooms);
          console.log(this.props.rooms)
        }).
        catch((err) =&gt; {
          console.log(err);
        })
      };
  }
  </code></pre>
  
  <p>Very simple component. Now I have my dispatch and exports set up like this</p>
  
  <pre><code>onst mapDispatchToProps = dispatch  =&gt; {
      return bindActionCreators({ setRooms }, dispatch);
  };
  
  export default connect(null, mapDispatchToProps)(DashBoard);
  </code></pre>
  
  <p>My room reducer looks like this</p>
  
  <pre><code>import {SET_ROOMS} from '../actions/index';
  
  function rooms_reducer(state = [], action) {
      switch (action.type) {
          case SET_ROOMS:
              return action.rooms;
          default:
              return state;
      }
  }
  
  export default rooms_reducer;
  </code></pre>
  
  <p>And finally my action looks like this.</p>
  
  <pre><code>export function setRooms(rooms) {
      const action = {
          type: SET_ROOMS,
          rooms
      }
      return action;
  }
  </code></pre>
  
  <p>Now I can't really seem to find why this.props.rooms in the control log is returning undefined. A little help would be really helpful. Thanks </p>