修改 props

在定义 Styled Component 时，可以利用 .attrs() 方法对要使用的 props 进行一些修改。.attrs() 接受一个 Lambda 表达式，表达式需要返回一个 JavaScript 对象，Styled Components 会自动将其与 props 对象合并。

const Input = styled.input.attrs(props => ({
  type: 'password',
  size: props.size || '1em'
}))`
  margin: ${props => props.size};
  padding: ${props => props.size};
`;

props 中可以直接携带 className 来使样式化组件直接使用已有的样式类，这样可以方便使用现有的 CSS 框架。