DEV Community

Discussion on: Page Transition Effect in NextJS

Collapse
quintisimo profile image
Quintus Cardozo

Cool idea, there are just two issues that could case problems. One is if you click the same link as the page still transitions. So if your on the home page and you click the home link it will fade out and fade back in. This is because comparing the children object always returns false as the reference is always different. One way to fix this is to compare the children.type.name instead which is the name of the component. The other issue was that the useEffect would run twice. This is also fixed by comparing the function name.

Collapse
anxiny profile image
Anxin.Y Author

Great suggestion! Thanks for pointing that out.