Unlock seamless workflows and faster delivery with our latest releases - Join the deep dive

How to fetch an array of images using groq in Sanity.io

5 replies
Last updated: May 21, 2023
Hello everyone,
I would like to fetch the array of the Images, but i don't know how to fetch it with the groq correctly. So, i assumed that i should write like this:
return client.fetch(
groq`*[_type == 'page' && slug.current == $slug][0]{
_id,
_createdAt,
"mainImage": mainImage.asset->url,
"image": images[].asset->url, //I am also querying images array here. //Array of Images
title,
"slug": slug.current,
content,
alt
}`,
{slug}
)

}


Hovewer, when i am debugging my function, my images in the console written as "null". Hence, what i should wtite to get my all Array of the Images?


P.S. {
//Here is the input that i created for Images array inside my Sanity studio
name: "image",
title: "Image",
type: "array",
of: [{ type: 'image' }],
options: { hotspot: true },

},
May 20, 2023, 12:57 PM
Hey! To fetch an array of reference like images and customize the fields inside, you can do this:‘images’: images[]->{
‘url’: asset.url,
etc.
}

Hope it’s help!
May 20, 2023, 3:09 PM
Thank you for your response, Valentin. However when i am fetching with your method, it still gives me "null" output in Studio vision:
Query:


*[_type == 'page' && slug.current == 'haight-ashbury']{

_id,

_createdAt,

"mainImage": mainImage.asset->url,

"images": images[]->{

'url':asset.url,

}, //I am also querying images array here.

title,

"slug": slug.current,

content,

alt,

}

Result:


images:null

title:HAIGHT-ASHBURY

slug:haight-ashbury
May 20, 2023, 10:18 PM
Can you try to remove the
->
?
"images": images[] {

'url':asset.url,

}
May 21, 2023, 8:08 AM
I’ve tried this on a personal projet and it works! Sorry for the typo at first!:
*[_type == 'work'] {
  images[] {
    'url': asset->url
  }
}
May 21, 2023, 8:11 AM
God bless you, Valentin! Now this time, your method worked fine. Thank you!
May 21, 2023, 2:45 PM

Sanity– build remarkable experiences at scale

Sanity is a modern headless CMS that treats content as data to power your digital business. Free to get started, and pay-as-you-go on all plans.

Was this answer helpful?