Get JSON Data in multiple components using reactjs and redux

I would like to show data from a single API to different components as I want to hit the API only once and distribute the data to multiple small components. I know I can do this by using redux state but not sure how to do it. Need your help to achieve this. Below is the code done so far.

homepage/index.js

import SlidingBanner from './banner/BannerList';
import Celebslider from './celebrityslider/CelebSlider';

class HomePage extends Component {
        render() {
          return (
            <div>
                <SlidingBanner />
                <anotherslider />
            </div>  
          );
        }
      }

    export default HomePage;

BannerList.js

import PropTypes from 'prop-types';
import { connect } from 'react-redux';
import { itemsFetchData } from '../../../actions/items';

class BannerList extends Component {

    componentDidMount() {
        this.props.fetchData();
    }

    render() {
        let bannerArray = [];
        let banner = this.props.items.banner
        for (let key in banner) {
            bannerArray.push(banner[key]);
            return (
                <div>
            <Slider {...slidersettings}>
            {this.props.items.banner.map((item) => (
                    <div key={item.id}>
                        <img src={item.image_url} className="img-responsive"/>
                    </div>
                ))}
            </Slider>        
            </div>
            );
        }
        if (this.props.hasErrored) {
            return <p>Sorry! There was an error loading the items</p>;
        }

        if (this.props.isLoading) {
            return <p>Loading…</p>;
        }
        return (null);
    }
}

BannerList.propTypes = {
    fetchData: PropTypes.func.isRequired,
    items: PropTypes.object.isRequired,
    hasErrored: PropTypes.bool.isRequired,
    isLoading: PropTypes.bool.isRequired
};

const mapStateToProps = (state) => {
    return {
        items: state.items,
        hasErrored: state.itemsHasErrored,
        isLoading: state.itemsIsLoading
    };
};

const mapDispatchToProps = (dispatch) => {
    return {
        fetchData: (url) => dispatch(itemsFetchData(url))
    };
};

export default connect(mapStateToProps, mapDispatchToProps)(BannerList);

anotherslider.js

Now in this file, i want to fetch another array of objects or object from the same API. 

I tried to mount the API in container component but did not worked, I hope i am doing some mistake. Please correct.