在React应用程序中添加CSS @keyframes动画以更改状态

Question

我有一个带react-router的React + Flux应用程序用于路由。 ＆＃39; sa .button组件与.button_active CSS类在React的onClick事件中切换到它，并且toggled:true状态正在添加到按钮通过Flux Action在应用程序顶部对象。

因此，.button_active类附加了CSS @keyframes动画，以便将.button的状态更改从常规动态设置为活动状态，反之亦然。

除了动画不仅在点击（状态更改）上被触发，而且在每次路径更改时都会被触发（.button_active className到位，但每次都创建/销毁父div时，一切都运行良好路线改变，因此动画继续射击）。

有没有办法避免这种行为，但仍然使用@keyframes动画来动画状态变化？

谢谢！

Answer 1

我认为您可以尝试删除disabled中的readonly，也许这会有效。