i have created a component and getting the data from userReducer and maaping it to props , but in render method if i console the data(i.e; array of users) , i can see the data in console but when i pass the data to a function and try to loop over the array , i am getting below error

**Uncaught TypeError: Cannot read property 'map' of undefined**

i am not understanding did i make any mistake.

```
import React, {Component} from 'react';
import PropTypes from 'prop-types';
import {connect} from 'react-redux'
import * as userActions from '../../actions/userActions'
class HomePage extends Component {
    constructor(props){
        super(props);
        this.state = {
            isLoading :true
        }
    }
    componentDidMount(){
        const {dispatch} = this.props
        dispatch(userActions.loadUsers());
    }
    renderData(data){
        debugger
        data.map(item=>{
            return (<div>
              <h1>{item.id}</h1>
            </div>)
        })
    }
    render() {
        // if(!this.props.usersReducer) return <p>Loading ....</p>
        return (
            <div>
                {console.log(this.props.userReducer.data)}
                {this.renderData(this.props.userReducer.data)} // if i comment this line i can see the users array in console but if i uncomment this line i am getting undefined in console for console.log(this.props.userReducer.data) too
            </div>
        );
    }
}    
HomePage.propTypes = {};
HomePage.defaultProps = {};    
const mapStateToProps = (state, props) =>
    ({
        userReducer : state.userReducer
    })
export default connect(mapStateToProps)(HomePage);

```