Getting the url of the reference fields using Graph QL

Question

I want to expose my Sitecore data to frontend using GraphQL edge queries. How do I get the url of the items selected in the multilist field? I tried using url keyword but getting the below error (see screenshot)

How can we achieve the same? Any help would be highly appreciated.

Answer 1

To get the URL of selected item in the multilist (reference filed) you can build up a query like below.

Here I'm using the default jss site with running a local docker/graphql instance.

query GetItemByItemID($itemId: String!){
  item(path:$itemId){
    ... on StyleguideFieldUsageContentList{
    name
    path
    sharedContentList{
      targetItems{
         ... on StyleguideContentListItemTemplate{
          url
          displayName
          textField{
            value
            }
          }
        }
      }
    }
  }
}

Query Variables: {"itemId":"{4394DB92-9283-5AC6-9E8C-5C60DC32A140}"}

GraphQL requires that you construct your queries in a way that only returns concrete data. Each field has to ultimately resolve to one or more scalars. That means you cannot just request a field that resolves to a type without also indicating which fields of that type you want to get back.

That's what the error message you received is telling you. you requested an ItemUrl!, but you didn't tell GraphQL at least one field to get back from that type.

@serhii has already given more details to fix it.

Hope it helps!

Answer 2

The error message states:

Field url of type ItemUrl! must have a sub selection

If you go to docs (on the right on your screenshot), you'll find the URL object props:

What you need is to specify the subprop which in this case is also called url. In your query, instead of url use url { url }:

... on HeroBanner {
  products {
    targetItems {
      url {
        url
      }
    }
  }
}