我想为样式的按钮添加动画和特定的高度。事实是，我StyledButton是一个包装器，可以根据一个type样式为React Semantic UI Buttons的道具渲染多个预先样式化的按钮之一。
在此处查看具有复制的CodeSandbox：
https://codesandbox.io/embed/practical-haibt-oz9sl
问题是它确实从中获得了样式，ActionButton但是它不适用于我放在上的任何样式const AnimatedButton = styled(StyledButton)。
但是，如果我在没有包装器的情况下尝试相同的操作，则直接导入BaseButton并创建一个AnimatedBaseButton，这可以工作，但可以消除具有type返回预样式按钮的道具的模块化。
我在这里和google / github上搜索，但没有问题可以反映这一点。我知道我可以在上添加一个animation属性StyledButton并将其传递，但是使用真正的代码库是不可能的。
提前致谢 ！
编辑：添加了一个Codesandbox而不是代码示例。
在StyledButton.js：
render() {
const {
content,
icon,
iconPosition,
onClick,
type,
...otherProps // take base props passed through wrapper
} = this.props;
// ...
return (
<ButtonToDisplay
{...otherProps} // spread it firstly here so below props can override
onClick={onClick}
content={content}
/>
);
}
如您所见，styled(comp)''用于为组件设置样式的语法实际上是幕后的HOC组件，它接收一个组件并返回另一个组件。
因此，当您制作一个在astyled component和之间截取的包装器时real component，您需要允许props库生成的内容通过该包装器。
本文收集自互联网，转载请注明来源。
如有侵权，请联系 [email protected] 删除。
我来说两句