Get help on Discord

GROQ: Dereferencing nested image reference (reference in a reference)

8 replies
Last updated: Nov 29, 2025
Hello, I’m running into some difficulties with a 
GROQ
query getting a reference for an image 2 levels down (a reference in a reference).
My query looks like this:

"footerNavSocial": footerNavSocial->social[]{
  "alt": icon.alt,
  "image": icon.asset,
  link,
  name,
}
And it provides me with this data:

[
  {
    "alt": "Facebook",
    "image": {
      "_ref": "image-cecf0ea498a09fd23ed9d905abe6e48ba86b9eae-10x20-svg",
      "_type": "reference"
    },
    "link": "<https://www.facebook.com/timetap.onlinescheduling>",
    "name": "Facebook"
  },
  {
    "alt": "Twitter",
    "image": {
      "_ref": "image-26c444e906d4dbee7f5e14fec5f0adfcaf6d3849-20x16-svg",
      "_type": "reference"
    },
    "link": "<https://twitter.com/tmtap>",
    "name": "Twitter"
  },
  {
    "alt": "LinkedIn",
    "image": {
      "_ref": "image-daf93fd05aaf6980627b678ce4428b9ebf2d8130-19x19-svg",
      "_type": "reference"
    },
    "link": "<https://www.linkedin.com/company/timetap>",
    "name": "LinkedIn"
  }
]
It’s late, so maybe I’m missing something obvious, but I’m hoping I can get some pointers on how to grab the image URL. I tried this (and many other variations):

"footerNavSocial": footerNavSocial->social[]{
  "alt": icon.alt,
  "image": icon.asset->,
  link,
  name,
}
And that gave me an empty object and so I got no data for the “image” value

[
  {
    "alt": "Facebook",
    "link": "<https://www.facebook.com/timetap.onlinescheduling>",
    "name": "Facebook"
  },
  {
    "alt": "Twitter",
    "link": "<https://twitter.com/tmtap>",
    "name": "Twitter"
  },
  {
    "alt": "LinkedIn",
    "link": "<https://www.linkedin.com/company/timetap>",
    "name": "LinkedIn"
  }
]
AI Update

Looking at your query, you're dealing with a nested reference situation where icon.asset is a reference that needs to be dereferenced. The issue is that you need to dereference the asset reference within the context of the icon object.

Based on the data structure you showed, where icon.asset contains {_ref: "image-...", _type: "reference"}, you need to properly dereference that asset reference. The GROQ reference access operator -> can be chained to handle nested references.

Try this approach to get the full asset document:

"footerNavSocial": footerNavSocial->social[]{
  "alt": icon.alt,
  "image": icon.asset->,
  link,
  name,
}

If that's still returning empty, the path might need adjustment. Since you're working with Sanity image assets, you typically want to access the url field from the dereferenced asset:

"footerNavSocial": footerNavSocial->social[]{
  "alt": icon.alt,
  "imageUrl": icon.asset->url,
  link,
  name,
}

Or to get multiple fields from the asset:

"footerNavSocial": footerNavSocial->social[]{
  "alt": icon.alt,
  "image": icon.asset->{url, metadata},
  link,
  name,
}

If you're still getting empty objects, it could mean:

  1. The reference path isn't quite right - double-check that icon.asset._ref structure in your schema
  2. The asset documents don't exist or have been deleted
  3. There might be an issue with how icon is structured - it might itself be a reference that needs dereferencing first

If icon is also a reference, you'd need to dereference it before accessing asset:

"footerNavSocial": footerNavSocial->social[]{
  "alt": icon->alt,
  "image": icon->asset->url,
  link,
  name,
}

The key insight from the reference operator documentation is that each -> internally executes a subquery to fetch the referenced document, and you can chain these to traverse multiple levels of references.

Show original thread
8 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?