How can I use getInitialProps in my pages and in my _app at the same time? #15013

wilsongomes-swe · 2020-07-09T14:17:39Z

wilsongomes-swe
Jul 9, 2020

Hi guys,

We are passing by some issues trying to run the getInitialProps in our custom _app.tsx and in our pages at the same time... Seems like the getInitialProps in the app overrides the page getInitialProps...

Simple page example:

const Home = ({ id }) => {
  const { t } = useTranslation()

  return (
    <>
      <Head>
        <title>Home</title>
      </Head>

      <h2>
        Test #{id}
      </h2>
    </>
  )
}

Home.getInitialProps = () => {
  console.log('Home.getInitialProps')
  return { id: 10 }
}

export default Home

Custom app example:

function MyApp({ Component, pageProps }: AppProps) {
  return <Component {...pageProps} />
}

MyApp.getInitialProps = async (appContext) => {
  console.log('MyApp.getInitialProps')
  return {}
}

export default MyApp

When I run this, it only runs the getInitialProps in the _app.tsx... The unique console log that I get is the "MyApp.getInitialProps"...

How can I configure to execute the both getInitialProp?

Thanks so much!
Let me know if you need more informations...

Provide feedback

Saved searches

Use saved searches to filter your results more quickly

Uh oh!

How can I use getInitialProps in my pages and in my _app at the same time? #15013

Uh oh!

{{title}}

Uh oh!

Replies: 0 comments

Select a reply

Uh oh!

How can I use getInitialProps in my pages and in my _app at the same time? #15013

Uh oh!

wilsongomes-swe Jul 9, 2020

Replies: 0 comments

wilsongomes-swe
Jul 9, 2020