Get help on Discord

How to query referenced document with image in Portable Text?

7 replies
Last updated: Nov 29, 2025
Kia ora! I’m trying to expand the logic on this page to query a reference to a document that contains an image, to be able to display that image within my 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?
AI Update

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:

  1. Use @-> instead of @.reference-> - The @ symbol already represents the current reference object, so you just need to dereference it directly with @->

  2. 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 thread
7 replies

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.

Get started for freeExplore the demo

Was this answer helpful?