Question

我正在尝试使用样式化的组件，并且我试图将道具传递给他们。这是我的代码：

std::cout << membershipFine(join, today) << '\n';

eslint检查员一直告诉我const CustomDiv = styled.div` position: absolute; top: 23px; bottom: 0; left: 0; width: 100%; ${props => props.heigth && css` top: props.heigth; `} `;属性值不匹配。那么，我在这里错过了什么？

Answer 1

首先，我相信你误导了道具名heigth -> height。其次，尝试以下解决方案：

const CustomDiv = styled.div`
  position: absolute;
  top: 23px;
  bottom: 0;
  left: 0;
  width: 100%;

  ${({ height }) => height && `
    top: ${height}px;
  `}
`;

但是，如果height等于0，则无法呈现。您可以使用lodash中的isNumber函数或typeof height === 'number'。

如何将道具传递给样式组件

1 个答案: