How to fetch multiple data types with useGetStaticProps for nextjs

Developing with Prismic
1

I'm having a bit of trouble with slice machine. I noticed that it really seems to only work when using useGetStaticProps, which is fine for most cases. However, I do have a case where I want to fetch a page as well as get some dynamic content like the latest three articles. It doesn't look like there is a good hook for getServerSideProps or a way to have useGetStaticProps execute multiple queries in a getStaticProps hook. How are people getting around this?

One other example where this would be useful is fetching headers and footers or menus. In the documentation you use the _app.js component with a getInitialProps hook. However, this disables static generation on the nextjs side. If you could fetch a page alongside your menus or other objects in getStaticProps at the page level you would be able to leverage static site optimization from next as well instead of disabling it with the modified _app.js file.

Anyway just haven't really found any good answers in the documentation so wanted to see if anyone had more experience digging into this stuff with next.js or could point me in the right direction.

3

Hi Mike,

Thanks for posting this question, and welcome to the Prismic community! It's awesome to hear that you're trying out Slice Machine.

This is a good example of where getStaticProps() might be preferable to useGetStaticProps(). As you point out, useGetStaticProps() is only meant to fetch a single document.

Here's an example of a Prismic–Next.js site that uses getStaticProps():

In your message, it sounds like you might have tried this and encountered errors with Slice Machine? If that's the case, and this GitHub example doesn't help, could you describe the errors you're getting and send the code that's producing the error?

Thanks,
Sam

1 Like
4

Thanks Sam, this is what I was looking for. I definitely encountered some errors but my attempts weren't quite like this I was trying to spread props or props.body into the slice machine component so I figured there was some restructuring done by the useStatic hook that I'd missed.

I'm going to give this a shot but I'll let you know if I get any more errors. Thanks for the help here.

5

Awesome! I'll mark that as the solution, and this thread will close in 24 hours. But if it doesn't work out, or you have any other questions, send me a message and I'll open this back up.

6

This topic was automatically closed 24 hours after the last reply. New replies are no longer allowed.