1

I'm using nextjs/Sanity. Want to get all of the image types out of an array, but nothing is showing up and nothing is coming up in the console either. It's particularly everything within the current slug. Not sure if I have imagesQuery coded right.

export const getServerSideProps = async (pageContext) => {
  const setSlug = pageContext.query.slug;

  const setQuery = `*[_type == 'set' && slug.current == $setSlug][0]`;
  const imagesQuery = `*[_type == 'set' && slug.current == $setSlug][0]{image{
    asset->{_id, url}, alt, name, date, size, materials}}}`;

  const setData = await client.fetch(setQuery, {setSlug});
  const imagesData = await client.fetch(imagesQuery, {setSlug});

  return {
    props: {setData, imagesData}
  }
}

Edit: Okay I made a console log check, it is seeing that an array should appear, and has the correct amount of images, but it says each image is null.

paparonnie
  • 170
  • 8

1 Answers1

0

Reposted from another question I asked about this same issue:

Answer: I needed to change my schema so that my array was accepting an object with images in its field, not an image with fields as it returned every image as 'null'.

This reflects the change in my schema:

{...
            name: 'set_images',
            type: 'array',
            title: 'Set Images',
            of: [
                {
                    name: 'imageItem',
                    type: 'object',
                    title: 'Image Item',
                    options: {
                        hotspot: true,
                    },
                    fields: [
                        {
                            name: 'image',
                            type: 'image',
                            title: 'Image'
                        },    ...

And this is how I queried it:

const imagesQuery = `*[_type == 'set' && slug.current == $setSlug][0]{'imageItems':set_images[]{image{
    asset->{_id, url}, alt, name, date, size, materials}}}`;
And made sure it was mapping through imagesData.imageItems
paparonnie
  • 170
  • 8