Имена классов NPM Пакет - применение нескольких имен классов, если значение имеет один проп - PullRequest
Новая
       21

Имена классов NPM Пакет - применение нескольких имен классов, если значение имеет один проп

0 голосов
/ 31 марта 2020

Я создаю компонент React, который должен применять CSS классы на основе реквизитов, указанных приложением-потребителем. Я использую NPM пакета Classnames для оценки и объединения окончательной строки ClassName, необходимой для элемента, в зависимости от заданного реквизита. Мой компонент выглядит примерно так: 

<Tile type="feature">

Где тип может быть:

feature | маленький | горизонтальный | graphics (et c)

Я вызываю метод Classnames следующим образом: 

  const finalClassName = classNames(
    'm-tile',
    {
      'm-tile--borderless': noBorder,
      'm-tile--feature': variant === 'feature',
    },
    className,
  );

Я хотел бы применить несколько классов, когда «option» равно «feature» , Я пробовал: 

  const finalClassName = classNames(
    'm-tile',
    {
      'm-tile--borderless': noBorder,
      'm-tile--feature.m-tile--horizontal': variant === 'feature',
    },
    className,
  );

, но это просто делает как один класс с неповрежденной точкой.

Я также пробовал: 

  const finalClassName = classNames(
    'm-tile',
    {
      'm-tile--borderless': noBorder,
      'm-tile--feature' && 'm-tile--horizontal': variant === 'feature',
    },
    className,
  );

Но это не так либо не работает.

Есть идеи?

Спасибо

PS - Также используя Typescript в проекте (не уверен, что это актуально)

...