Search code examples
reactjsnext.jsserver-side-rendering

How to to use context.query with getServerSideProps()? | NextJS

I'm facing an issue with my getServerSideProps() on my NextJS app.

Basically I'm passing data for an nft collection (name, description, address etc.) manually from an internal json to the url of the collection clicked. When a user click the collection the dynamic mint page render with the data of the router.query.

I've successfully done it within the Mint page component into a useEffect with router.query. But when I've tried to make it with getServerSideProps() for SSR, nothing return from the context.query (the function below)

export async function getServerSideProps(context) {
  const mint = context.query;
  return { props: { mint } };
}

This is the MintSection component below the getServerSideProps()

function MintSection({ mint }) {
  console.log(mint);

  other code
  ...

}
Solution

  • Use destructuring.

    const {mint} = context.query;