How to query referenced document with image in Portable Text?
I have the image document (
photo) insertable in studio, and am now figuring out my query.
I’m trying something similar to this fragment from that page:
*[_type == "post"]{
...,
body[]{
...,
markDefs[]{
...,
_type == "internalLink" => {
"slug": @.reference->slug
}
}
}
}Here’s my query:
*[_type == "collection" && slug.current == "5-frames-with-a-yashica-a-and-ilford-xp-2-super-400"]{
title, description[]{...,
_type == "reference" => { "slug": @.reference->slug, "image": @.reference->image.asset}}}[0]
In vision, the query runs but the
”type”: “reference”objects returned aren’t outputting the slug or image key that I’m trying to query for. Is there something missing from my syntax?
Looking at your query, I can see the issue. When you're trying to expand references within an array like description[], you need to handle the projection differently. The @ symbol refers to the current item in the array iteration, and when you use @.reference->, you're trying to dereference, but the syntax needs adjustment.
Here's the corrected approach:
*[_type == "collection" && slug.current == "5-frames-with-a-yashica-a-and-ilford-xp-2-super-400"]{
title,
description[]{
...,
_type == "reference" => @->{
slug,
"imageUrl": image.asset->url
}
}
}[0]The key differences:
Use
@->instead of@.reference->- The@symbol already represents the current reference object, so you just need to dereference it directly with@->Projection after dereferencing - After
@->, you can project the fields you want from the referenced document
If your portable text has mixed content (some references, some regular blocks), you might want to conditionally handle both:
*[_type == "collection" && slug.current == "5-frames-with-a-yashica-a-and-ilford-xp-2-super-400"]{
title,
description[]{
_type != "reference" => @,
_type == "reference" => @->{
slug,
"imageUrl": image.asset->url
}
}
}[0]This pattern (shown in the conditionals section of the query cheat sheet) returns the inline object for non-references and expands the referenced document for references.
The reason your original query wasn't working is that @.reference doesn't exist - @ itself is the reference object, which has _ref and _type properties. The -> operator is what follows the reference to get the actual document.
Show original thread7 replies
Was this answer helpful?
Sanity – Build the way you think, not the way your CMS thinks
Sanity is the developer-first content operating system that gives you complete control. Schema-as-code, GROQ queries, and real-time APIs mean no more workarounds or waiting for deployments. Free to start, scale as you grow.
