title: How do I use gatsby-image with an Array of Objects?
body: <p>How do I use gatsby-image with an Array of Objects?</p>
  <p>For example I have this:</p>
  <pre><code>const dataImgs = [
    { id: 1, title: &quot;Astronaut&quot;, img: &quot;gatsby-astronaut.png&quot; },
    { id: 2, title: &quot;Icon&quot;, img: &quot;gatsby-icon.png&quot; }
  ]
  </code></pre>
  <p>And the files are in the folder /src/images</p>
  <p>And I want to use use Gatsby Image for Optimization</p>
  <p>My problem is I do not understand how I can make a GraphQL query.
  I'm getting the filename from an object and I want to join the paths in the GraphQL Query.</p>
  <p>Thanks.</p>
  <p>Here's a codesandbox which may help you understand better what i'm tring to do
  <a href="https://codesandbox.io/s/summer-hooks-im9q7?file=/src/components/image.js" rel="nofollow noreferrer">https://codesandbox.io/s/summer-hooks-im9q7?file=/src/components/image.js</a></p>