[英]How to trigger css animation in styled-components?
You could use props to change the styles, for example:你可以使用 props 来改变样式,例如:
const MyComp = styled.div`
transition: width 2s;
width: ${props => props.animate ? "20px" : "10px"};
`
You can then pass a prop when you use the component to trigger the animation:然后可以在使用组件触发动画时传递一个 prop:
<MyComp animate={booleanFlag} />
In this case, you can toggle the animate prop between true and false as necessary.在这种情况下,您可以根据需要在 true 和 false 之间切换animate道具。 Perhaps using state from the parent component.
也许使用来自父组件的状态。
声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.