动画样式CSS到JS样式变量

我需要这个CSS行：

.anim-typewriter{
     animation: typewriter 2.5s steps(25) 1s 1 normal both,
                blinkTextCursor 650ms steps(25) infinite normal;
}

要使其成为ReactJS变量样式，我需要根据文本道具的大小动态更改步长和秒数。

const getAnimationStyle=（持续时间、步长、闪烁光标或持续时间）=>{
const getAnimationStyle = (duration, steps, blinkCursorDuration) => {
  // returns the css style as a js object
  return {
    animation: `typewriter ${duration}s steps(${steps}) 1s 1 normal both`,
   'blinkTextCursor' : `${blinkCursorDuration}ms steps(${steps}) infinite normal`
  };
}

// set style in element
<div style={getAnimationStyle()}></div>

//将css样式作为js对象返回
返回{
动画：`typewriter${duration}的步骤（${steps}）1s 1正常两个`，
'blinkTextCursor'：`${blinkCursorDuration}ms步骤（${steps}）无限正常`
};
}
//在元素中设置样式

嘿，George，样式化组件可能可以帮助您解决此问题。不幸的是，

blinkTextCursor

您让它看起来像是一种独立的样式，但它是动画样式的一部分。