Issue animating react components using framer motion on state change

Question

Im having some issues getting an animation to work using framer motion. Any help would be greatly appriciated.

Code Sandbox Example

Answer 1

You went a bit too far trying to use custom properties here. Simple ternary conditional in animate did the trick.

Also, you had a bug in your increment decrement function, I fixed it too.

Check my solution here: https://codesandbox.io/s/framer-motion-issue-forked-6no3o?file=/src/App.js