问题
I notice that in NextJs, whenever I click on a <Link> to go to another page, it calls the getInitialProps even if that "another" page is the same page.
For instance, on /profile page, there are 2 components, one for "user information" and the other component for "list of orders" which is paginated. Both data used in "user information" and "list of orders" components are fetched from APIs in getInitialProps of the /profile page.
When I click to go to the next page of the "list of orders" component on /profile page, it goes to /profile/p/2. The data loads and it all works fine, except that /profile/p/2 actually reloads the whole profile page and re-fetches the "user information" data which should have remained the same (and doesn't need to be re-fetched) as long as the page is part of /profile page.
Is there a way to navigate to /profile/p/2 from /profile without reloading the whole page but only the component showing the list of orders?
回答1:
You can pass shallow to Link like this
<Link href="...." as="...." shallow=true />
来源：https://stackoverflow.com/questions/55796012/how-to-navigate-to-another-page-without-reloading-the-whole-page-in-nextjs