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

Question

Я использую Ant Design в своем реактивном проекте.Я хочу использовать компоненты Ant Design без имен классов по умолчанию.

Обратите внимание на следующий код:

import { Typography } from "antd";

const { Title } = Typography;

~~

<Title level={4}> ...

Причины иметь ниже:

<h4 class="ant-typography" ...

И егоCSS:

// in the less file:
h4.ant-typography {
    // some css
}

Поэтому, когда я добавляю свое имя класса к компоненту, приоритет имени класса Ant Design компонента выше моего!

Мой классзовут .root-23-07.это приоритетное число 10, но из-за использования имени тега в меньшем файле приоритетное значение выбора And Design CSS равно 11.поэтому стили Ant Design переопределяют мои.

Я хочу использовать компоненты And Design без имен классов по умолчанию. Возможно ли это?

Answer 1

Если я правильно понимаю ваш вопрос, нет, вы не можете использовать antd, не имея имен базовых классов .Поскольку React выводит raw html и css, отсутствие имен классов приведет к тому, что стили, которые вы предоставите, не будут иметь никакого стиля.

Вам нужно будет либо привести классы в соответствие с уровнем специфичности, либо использовать !important