我在使用Anime.JS和React-Anime包装器库时遇到一些问题。我的主要问题是触发动画的最佳做法是什么？在Anime.js中，可以通过onClick调用anime()函数，并定位某些DOM元素。
我正在尝试使SVG变体，并且试图了解在React中处理此问题的最佳方法是什么。我不能只调用anime()，因为<Anime>包装器组件可以帮我实现这一点。
在初始状态下，我正在渲染没有<Anime>包装器的裸元素。启用动画开始标记后，我将有条件地渲染包裹在<Anime>组件中的元素，从而触发动画。
但是，当返回到初始状态时，我重新渲染了裸元素，它没有过渡。
我有一个有效的Codepen演示了此方法： https://codesandbox.io/embed/6lxoq1vz5r
当我有条件地渲染不同的PROPS来表示所需的动画状态时，我的示例崩溃了。我试图通过为points提供不同的值来变形SVG多边形。但是，出了点问题-当shouldAnimate状态从false切换到true时，我的整个多边形从DOM中消失了，应用崩溃了。返回false时，即使应用最初加载时处于该状态，整个过程也会崩溃。
示例：https://codesandbox.io/s/mjv24o32rp
我是否错误地包装了SVG元素？我不确定为什么一切都消失了