I'm trying to animate transition between pages in a NextJs application (app router).
All works fine but if you click the links back and forth a bit to fast AnimatePresence will have two animation.div's.
I can't find a good solution on how to handle this.
React tree without bugg:
React tree with bugg:
It can even add several pages:
Steps to reproduce:
Start my stackblitz
Click between two links back and forth and it will render page content twice.
I'm trying to animate transition between pages in a NextJs application (app router). All works fine but if you click the links back and forth a bit to fast AnimatePresence will have two animation.div's. I can't find a good solution on how to handle this.
React tree without bugg:
React tree with bugg:
It can even add several pages:
Steps to reproduce:
Stackblitz: https://stackblitz.com/edit/stackblitz-starters-xnrzd1?file=package.json,app%2Flayout.tsx,app%2FPageTransitionEffect.tsx