如何解决将 CSS 关键帧动画添加到“样式化” Material UI 组件 [React、Material UI、JSS]
我正在尝试向 Material UI styled
组件添加 CSS 关键帧动画,但添加关键帧动画似乎会引发错误。这是我的代码的样子:
const PulsatingCircle = styled("div")(({
theme,}) => ({
"@keyframes pulsate": {
from: {
opacity: 1,transform: "scale(1)",},to: {
opacity: 0,transform: "scale(2)",background: theme.palette.primary.main,borderRadius: "100%",animation: "$plusate 1s infinite ease",position: "absolute",zIndex: -2,}));
此代码返回以下错误:
TypeError: container.addRule(...).addRule is not a function
Array.onProcessStyle
src/optimized-frontend/node_modules/jss-plugin-nested/dist/jss-plugin-nested.esm.js:93
90 | }));
91 | } else if (isNestedConditional) {
92 | // Place conditional right after the parent rule to ensure right ordering.
> 93 | container.addRule(prop,{},options) // Flow expects more options but they aren't required
| ^ 94 | // And flow doesn't know this will always be a StyleRule which has the addRule method
95 | // $FlowFixMe[incompatible-use]
96 | // $FlowFixMe[prop-missing]
是否有在这样的样式组件中使用 @keyframes
的解决方案?
注意:我使用的是 Material UI 的内置 styles
API 而不是样式组件。
版权声明:本文内容由互联网用户自发贡献,该文观点与技术仅代表作者本人。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如发现本站有涉嫌侵权/违法违规的内容, 请发送邮件至 dio@foxmail.com 举报,一经查实,本站将立刻删除。