如何在带有样式组件的伪元素上传递道具？

Posted 2023-03-15

【中文标题】如何在带有样式组件的伪元素上传递道具？

【英文标题】：How to pass props on Pseudo-elements with styled components?

【发布时间】：2020-06-06 23:05:56

【问题描述】：

更具体地说，我需要在content:" " 上传递道具的帮助 这是我的例子：

  &::after 
  content: "test";
  color: $props => props.color;
  background: $props => (props.bg ? "green" : "blue");

这是组件：

   <StyledBox bg="red" color="green" text="webpack">
      <Webpack />
    </StyledBox>

如果我在内容中传递此内容不起作用：

$props => props.text

知道解决方案是什么吗？

【参考方案1】：

哇...我不确定这是否是正确的语法和解决方案，但如果我用这样的引号将内容道具包装起来，它就可以工作：

content:'$props => props.text';