React Redux - this.props.actions.fetchPosts is not a function
<p>i have issue with calling async action from my component, i think i did everything what was needed to work but seems like not, i used:</p>

<blockquote>
  <p>mapDispatchToProps</p>
</blockquote>

<p>and inside i return </p>

<blockquote>
  <p>actions: bindActionCreators(fetchPosts, dispatch)</p>
</blockquote>

<p>and i connect it.</p>

<p>After all these things, i try to call this action in my component -</p>

<blockquote>
  <p>this.props.actions.fetchPosts()</p>
</blockquote>

<p>in result i get this error in console -</p>

<blockquote>
  <p>this.props.actions.fetchPosts is not a function</p>
</blockquote>

<p><a href="https://i.stack.imgur.com/lpIPJ.png" rel="nofollow noreferrer"><img src="https://i.stack.imgur.com/lpIPJ.png" alt="enter image description here"></a></p>

<p>And i can not understand what's the problem with it as i did everything, here will be the full source: </p>

<p>Component</p>

<pre><code>import React, { Component } from 'react';
import { Link } from 'react-router';
import styles from './Home.css';
import { fetchPosts } from '../actions/counter';
import { connect } from 'react-redux';
import { bindActionCreators } from 'redux';


    class Home extends Component {

        constructor(props) {
            super(props)
        }
        render() {
                return (
                        &lt;div&gt;
                            &lt;div className="container"&gt;
                                &lt;div className="banner_animated"&gt;
                                    &lt;p&gt; dadasda&lt;/p&gt;
                                &lt;/div&gt;
                            &lt;/div&gt;
                            &lt;div className="container-fluid"&gt;
                                &lt;div className="center"&gt;
                                    &lt;input type="text"/&gt;
                                    &lt;button className="btn-2 btn-2a btn" onClick={this.props.actions.fetchPosts()}&gt;Button&lt;/button&gt;
                                &lt;/div&gt;
                            &lt;/div&gt;

                        &lt;/div&gt;
                );
        }
}
function mapStateToProps(state) {
        return state
}
function mapDispatchToProps(dispatch) {
    return {
        actions: bindActionCreators(fetchPosts, dispatch)
    };
}

export default connect(mapStateToProps, mapDispatchToProps)(Home);
</code></pre>

<p>Action</p>

<pre><code>import { FETCHING_WIN_RATES, FETCHED_WIN_RATES } from '../const';
import { firebaseDb } from './firebase';

const ref = firebaseDb.ref("win_rate");

    function fetchingWinRates() {
        return {
                type: FETCHING_WIN_RATES
        };
}

    function fetchedWinRates(winRates) {
        return {
                type: FETCHED_WIN_RATES,
                winRates
        };
}
// win rate champions
export function fetchPosts() {
        return dispatch =&gt; {
                dispatch(fetchingWinRates());
                ref.on("value", function(snapshot) {
                        dispatch(fetchedWinRates(snapshot));
                        console.log(snapshot.val());
                }, function (errorObject) {
                        console.log("The read failed: " + errorObject.code);
                });
        }
}
</code></pre>

<p>Write if you need some more files to help me, thank you.</p>