'Next.js getStaticProps with query params occurs mounting twice

I have a simple code.

/pages/MyPage.tsx

const React from 'react';

const MyPage = () => {
  React.useEffect(()=>{
    console.log('Mounted..');
  }, []);
  console.log('Rendered..');
  return (<div>MyPage</div>);
};

export const getStaticProps = async ctx => {
  // do something... with ctx;
  return {
    props: {},
  }
};
export default MyPage;

and I entered localhost:3000/MyPage?query=randome,

My browser console is like below that.

Rendered..
Mounted..
Rendered..
Mounted..

I don't know how it mounted twice.



Sources

This article follows the attribution requirements of Stack Overflow and is licensed under CC BY-SA 3.0.

Source: Stack Overflow

Solution Source