使用样式组件为目标指定特定的CSS类

Question

如何使用样式组件将样式设置为react-datepicker？ datepicker库看起来像它使用某种类型的BEM风格（下面的屏幕截图），我通常会使用他们提供的类名和样式使用Sass。但是，我将如何将这些类名称与样式化组件相关联？这甚至有可能吗？

Answer 1

由于styled-components只是CSS™你会做它像任何其他样式表，通过使用react-datepicker提供的类名。

唯一的区别是，你必须包装在一个包装样式的组件的日期选择器，其适用于所有这些类：

const Wrapper = styled.div` 
    &.react-datepicker { 
    color: blue; 
    } 
` 

<Wrapper> 
    <Datepicker /> 
</Wrapper>