javascript - 如何在 React JS 的内联样式中动态更改动画值

Question

我发现了许多有关 ReactJS 内联样式的相关问题，但不适合我。
我需要根据 API 值(动态变化)更改 UI 中的动画速度(1,3,4,6,7 是我的动画速度)
我尝试了以下方式

<img className="fan1" src={fan1} style={{animation: "spin "`${2}`"s linear infinite" }}></img>    
<img className="fan1" src={fan1} style={{animation: "spin ${2}s linear infinite" }}></img>
<img className="fan1" src={fan1} style={{animation: `spin {2}s linear infinite` }}></img>
<img className="fan1" src={fan1} style={{animation: {spin {2}s linear infinite} }}></img>

我不知道如何实现这一点。请帮帮我。

Answer 1

这对我有用

<img className="fan1" 
      src={fan1}
      style={{ animation: `spin ${5}s linear infinite` }}
      alt="fan"
  ></img>