title: Cannot read properties of undefined (reading 'map')
body: <p>I need your help. I'm trying to get API data through redux. I have everything I need: action_types, action_creators, reducer. When I try to draw data, I get an error: <code>Cannot read properties of undefined (reading 'map')</code>.What is my mistake? Thank you very much. Here is my code</p>
  <p>cartoons.js</p>
  <pre><code>import React, {useEffect} from &quot;react&quot;;
  import {useDispatch, useSelector} from &quot;react-redux&quot;;
  import {cartoons_are_loaded} from &quot;../redux/action_creators&quot;;
  
  export let Cartoons = () =&gt; {
  
  let dispatch = useDispatch();
  let cartoons = useSelector(({cartoon_reducer: {cartoons}}) =&gt; cartoons);
  
  let fetchCartoons = async () =&gt; {
      try {
          let response = await fetch('https://api.sampleapis.com/cartoons/cartoons2D');
          let json = await response.json();
          console.log(json);
          dispatch(cartoons_are_loaded(json.data))
      } catch (e) {
          console.log(e)
      }
  }
  
  useEffect(() =&gt; {
     if (!cartoons.length){
         fetchCartoons();
     }
  },[])
  
  return (&lt;div&gt;
      {cartoons.map(el =&gt; &lt;div key={el.id}&gt;{el.title}&lt;/div&gt;)}
          &lt;/div&gt;)
  }
  </code></pre>
  <p>reducers.js</p>
  <pre><code>import {CARTOONS_ARE_LOADED} from &quot;./action_types&quot;;
  
  let initialState = {
  cartoons: []
  }
  
  let cartoon_reducer = (state = initialState, action) =&gt; {
  switch (action.type) {
      case CARTOONS_ARE_LOADED: {
          return {
              ...state,
              cartoons: action.payload
          }
      }
  
      default:
          return state;
  }
  }
  export default cartoon_reducer;
  </code></pre>
  <p>action_types.js</p>
  <pre><code>let CARTOONS_ARE_LOADED = 'CARTOONS_ARE_LOADED';
  let DELETE_FAVOURITE_MOVIE = 'DELETE_FAVOURITE_MOVIE';
  let ADD_FAVOURITE_CARTOON = 'ADD_FAVOURITE_MOVIE';
  export {
  CARTOONS_ARE_LOADED,
  ADD_FAVOURITE_CARTOON,
  DELETE_FAVOURITE_MOVIE
  }
  </code></pre>
  <p>action_creators.js</p>
  <pre><code>import {
  CARTOONS_ARE_LOADED,
  } from &quot;./action_types&quot;;
  let cartoons_are_loaded = (payload) =&gt; ({type : CARTOONS_ARE_LOADED, payload});
  export {
  cartoons_are_loaded
  }
  </code></pre>
  <p>all_reducers.js</p>
  <pre><code>import cartoon_reducer from &quot;./reducers&quot;;
  import {combineReducers} from &quot;redux&quot;;
  export let root_reducer = combineReducers({
  cartoon_reducer
  })
  </code></pre>