蚂蚁设计中的造型相关组件

Question

我可以通过简单地用 styled 封装一个 antd 复选框组件来实现样式。

import { Checkbox } from 'antd';
const StyledCheckbox = styled(Checkbox)`...`

然而，当我想渲染一些衍生的东西时，比如说一个 Checkbox.Group，当我使用了一个 StyledCheckbox.Group

样式版不再包含组属性。

有什么方法可以解决这个问题吗？

Answer 1

有什么方法可以克服这个问题吗？

我想没有。我认为你应该创建两个风格化的组件共享共同的风格。

import styled, { css } from 'styled-components';

const commonStyle = css`
  ...
`;

const StyledCheckbox = styled(Checkbox)`
  ${commonStyle}
`;

const StyledCheckboxGroup = styled(Checkbox.Group)`
  ${commonStyle}
`;