title: Why is my image request undefined in my Vue.js Nuxt app
body: <p>I can't figure out why my nuxt app isn't pulling images from my database. I have a list component and separate component for the list items which iterates over project in my project list.</p>
  
  <p>I can pull all other data through like project names, summaries without issue but although I've added images for each project in my Strapi database I can't seem to get the data. I ran a GraphQL query to double check the JSON data which confirms the images are attached to the projects, for example:</p>
  
  <pre><code> {
      "id": "2",
      "Name": "Kīpuka",
      "image": [
        {
          "url": "/uploads/190217_KIPUKA_Editorial_Mockup_paas_e2e1316f4c.jpeg"
        }
      ]
    },
  </code></pre>
  
  <p>I am trying to pull the images into my app like this; I'm trying to bind the image source so for every project it shows the respective image.</p>
  
  <pre><code>  &lt;ul :key="project.id"&gt;
     &lt;img class="hover-preview" :src="'https://localhost:1337/' + project.image.url" alt=""&gt;
     &lt;/ul&gt;
  </code></pre>
  
  <p>The images do not load and the network window shows the request is undefined. </p>
  
  <pre><code> "Request URL:https://localhost:1337/undefined"
  </code></pre>
  
  <p>I'm not sure why it can't find the url since it is passed using "project.image.url", I had a look at other questions on Stack Overflow but I couldn't find an answer that seems to fix my issues, any help would be really appreciate as I've hit a wall with this and can't progress.</p>