Get linked images in a post

[jean-bertrand]

Hi,

I have a space in which I have a blog post type, which has contents and linked image assets. I'm able retrieve all content except for the linked images.

Reference: https://github.com/jean-bertrand/portfolio/blob/9259495f9f33cf334464ce7a10cbd2804264a29d/pages/portfolio/_slug.vue#L21

I keep getting "Cannot read property 'file' of undefined" error and I can't seem to figure out what I'm doing wrong.

Thanks

[stefanjudis]

Hey Jean-Bertrand,

image seems to be undefined. Did you publish and reference the image correctly?

[jean-bertrand]

@stefanjudis The image is definitely published and I believe i'm referencing it correctly. When i reference post.fields.imagesI get the following output:

[
  {
    sys: {
      space: { sys: { type: "Link", linkType: "Space", id: "684j955bix95" } },
      id: "61PxashLvqwU2e0UOyiECy",
      type: "Asset",
      createdAt: "2018-03-25T00:12:29.149Z",
      updatedAt: "2018-04-29T23:38:50.249Z",
      environment: {
        sys: { id: "master", type: "Link", linkType: "Environment" }
      },
      revision: 2,
      locale: "en-US"
    },
    fields: {
      title: "Dashboard Notification",
      file: {
        url:
          "//images.ctfassets.net/684j955bix95/61PxashLvqwU2e0UOyiECy/45dd3782e7084fe3d57f28e6b42ec387/rep-dash-notifications.png",
        details: { size: 104189, image: { width: 2880, height: 1670 } },
        fileName: "rep-dash-notifications.png",
        contentType: "image/png"
      }
    }
  },
  {
    sys: {
      space: { sys: { type: "Link", linkType: "Space", id: "684j955bix95" } },
      id: "1PepZDiNAgocy642MI0G4G",
      type: "Asset",
      createdAt: "2018-03-25T00:12:14.748Z",
      updatedAt: "2018-03-25T00:12:14.748Z",
      environment: {
        sys: { id: "master", type: "Link", linkType: "Environment" }
      },
      revision: 1,
      locale: "en-US"
    },
    fields: {
      title: "Rep profile and account",
      file: {
        url:
          "//images.ctfassets.net/684j955bix95/1PepZDiNAgocy642MI0G4G/32628e5cf1fa50ed1aaa09ce348b7829/rep-profile-and-account.png",
        details: { size: 101216, image: { width: 2880, height: 1670 } },
        fileName: "rep-profile-and-account.png",
        contentType: "image/png"
      }
    }
  }
]

However, when I then reference post.fields.images.fields.file.url to get the url of the images, that's when i get the undefined error.

[Khaledgarbaya]

Hey @jean-bertrand
you are looping through the images in line 20 but you are not using the wrong object
The code should be :src="image.fields.file.url"