Question

我是函数式编程的新手，所以我很难理解道具如何与React的插件，样式组件一起使用。

我试图让我的网站（div）的背景有一个渐变。有两个径向梯度构成了这个梯度。径向渐变的中心以及径向渐变的颜色基于传递到样式化组件的属性。这就是我试图这样做的方式：

const backgroundChange = keyframes`
    0%, 100% {
        `background: ${(props) => radial-gradient(ellipse at props.xLeftPercent+'%' props.yLeftPercent)+'%', rgba(props.leftR + props.leftRStep * 0, props.leftG + props.leftGStep * 0, props.leftB + props.leftBStep * 0, 0.5), transparent),
                                  radial-gradient(ellipse at props.xRightPercent+'%' props.yRightPercent)+'%', rgba(props.rightR + props.rightRStep * 0, props.rightG + props.rightGStep * 0, props.rightB + props.rightBStep * 0, 0.5), transparent)`};
    50% {
        `background: ${(props) => radial-gradient(ellipse at props.xLeftPercent+'%' props.yLeftPercent)+'%', rgba(props.leftR + props.leftRStep * 50, props.leftG + props.leftGStep * 50, props.leftB + props.leftBStep * 50, 0.5), transparent),
                                  radial-gradient(ellipse at props.xRightPercent+'%' props.yRightPercent)+'%', rgba(props.rightR + props.rightRStep * 50, props.rightG + props.rightGStep * 50, props.rightB + props.rightBStep * 50, 0.5), transparent)`};
    }
`

我收到错误：

Unexpected token, expected ; (7:3)

有没有人可以为我解决我的语法错误，你是否也可以建议一些指南或文档来帮助我（样式组件文档似乎对我这里帮助不是很有用）？

如何使用属性来定义具有React样式组件的径向渐变？

0 个答案: