Query a Singleton Type


These docs rely on Slice Machine, which is in active development and subject to change. Content Relationships are not currently supported with Slices.

Thanks to the useGetStaticProps lifecycle hook that we've created for using Slice Machine with Next.js it's really simple to query a Single type. In the example below we have a file called index.js where we we import the useGetStaticProps method from next-slicezone/hooks.

We then declare the queryType as Single inside the useGetStaticProps method and declare the name of the type, in this case homepage. Then the function does the query for us and we pass the props to the slice-zone component.

import { Client } from '../prismic'
import SliceZone from 'next-slicezone'
import { useGetStaticProps } from 'next-slicezone/hooks'

import resolver from '../sm-resolver.js'

const Page = (props) => <SliceZone {...props} resolver={resolver} />

// Fetch content from prismic
export const getStaticProps = useGetStaticProps({
  client: Client(),
  queryType: ‘single’,
  type: ‘homepage’

export default Page