title: Array is looking empty, but have 4 objects
body: <p>I make a async function to get offers, and add to array with another array. But the offers array are looking empty in console, but when I click shows the itens.</p>
  <p>The products are comming that's isn't the problem. The problem is that I can't add the <code>arrayOffers</code> to <code>itemsArray</code>.</p>
  <p>OBS: the forEach is from <code>p-interation</code> lib.</p>
  <p>this is my code.</p>
  <pre><code>useEffect(() =&gt; {
          if (auth &amp;&amp; auth._id) {
              const fetchUserVisitedProducts = async (id) =&gt; {
                  const user = await getPublicUserRequest(id);
                  let array = [];
  
                  forEach(user.offers_visited, async (id) =&gt; {
                      const offers = await getOfferRequest(id)
                      array.push(offers)
                  });
                  const arrayOffers = array;
                  console.log(arrayOffers)
                  const itemsArray = [ ...user.barbadas_visited, ...arrayOffers]
                  console.log(itemsArray)
                  
              }    
              fetchUserVisitedProducts(auth._id)
          }
    
      },[auth])
  </code></pre>
  <p>In the image, I see one array with 4 objects, but looks empty. And another array that is correct.</p>
  <p><a href="https://i.stack.imgur.com/rYtgg.png" rel="nofollow noreferrer"><img src="https://i.stack.imgur.com/rYtgg.png" alt="IMAGE ARRAYS" /></a></p>