Как добавить дополнительные переменные в существующие свойства в Ant Design?

Question

Компонент Button в AntD имеет свойство type, которое принимает переменные primary dashed ghost danger.Как я могу добавить type=success, где успех будет определен с определенным цветом в моем .less файле?Я не имею в виду примеры AntD, где они указывают, как изменить ранее существовавший основной цвет, а скорее создаю новый.

Answer 1

Вы можете создать новый компонент, который будет использовать компонент кнопки из Ant Design.

import { Button } from 'antd';

const antdTypes = ['primary', 'dashed', 'ghost', 'danger'];

function ExtendedButton({ type, ...rest }) {
  if (antdTypes.inclues(type))
    return <Button type={type} {...rest} />
  else
    return <Button className={`button--${type}`} {...rest} />
}

Вы сможете, например, создать класс CSS / LESS button--success и затем передать вторую часть (M от BEM) класса в качестве опоры