title: mapDispatchToProps is not putting my function into props
body: <p>I am using React with Redux and following a tutorial, but I cannot for the life of me figure out this error.</p>
  
  <blockquote>
    <p>Uncaught TypeError: this.props.fetchPosts is not a function  </p>
  </blockquote>
  
  <p>I have a src file with actions/index.js and I have a components/posts_index.js file. As far as I can tell, these are the only two files involved in this error, and I do not believe mapDispatchToProps is actually putting my function in this.props, but I don't know why.  </p>
  
  <p>components/posts_index.js</p>
  
  <pre><code>import React, { Component } from 'react';
  import { connect } from 'react-redux';
  import { bindActionCreators } from 'redux';
  
  import fetchPosts from '../actions/index';
  
  class PostsIndex extends Component {
    componentWillMount() {
      this.props.fetchPosts();
    }
  
    render() {
      return(
        &lt;div&gt;List of Blog Posts&lt;/div&gt;
      )
    }
  }
  
  function mapDispatchToProps (dispatch) {
    return bindActionCreators({ fetchPosts }, dispatch);
  }
  
  export default connect(null, mapDispatchToProps)(PostsIndex);  
  </code></pre>
  
  <p>actions/index.js</p>
  
  <pre><code>import axios from 'axios';
  
  export const FETCH_POSTS = 'FETCH_POSTS';
  
  const ROOT_URL = 'http://reduxblog.herokuapp.com/api';
  const API_KEY = '?key=hn8y9e7yhvjkw9w887';
  
  export function fetchPosts () {
    const request = axios.get(`${ROOT_URL}/posts${API_KEY}`);
  
    return {
      type: FETCH_POSTS,
      payload: request
    }
  }
  </code></pre>
  
  <p>Any help is greatly appreciated!</p>