Can't get AnimatePresence in Framer Motion to work

Question

I've been trying to get <AnimatePresence> from Framer Motion to work. But for some reason, I can't get it to work. I want to have an exit animation for a mobile navbar.

Here's a screenshot of the code:

Here's the animation variables:

It animates when en entering the DOM, but there's no animation when it leaves. Any help is greatly appreciated!

I've tried moving the different components around, but nothing seems to work.

Answer 1

From the Framer docs:

Child motion components must each have a unique key prop so AnimatePresence can track their presence in the tree.

You need to add a unique key prop to your m.ul element.