Maquette JS Условный CSS

Question

Я пытаюсь создать массив элементов 'li', которые содержат значки для навигации на уровне приложения. У меня есть класс css "is-active", который выделяет активный элемент 'li' в списке, указывая на активное местоположение в схеме nav. Я ожидаю, что Maquette JS отобразит соответствующий значок как "подсвеченный", когда он выбран конечным пользователем. Я пытаюсь использовать свойство classes:{} как таковое:

"classes": this._activeNavElementId === navItem.id ? "nav-menu-item nav-menu-item-is-active" : "nav-menu-item", ...

Очевидно, что это неправильное использование. Учебное пособие предоставляет пример, где логическое значение определяет, находится ли класс в classList; однако, мне действительно нужно использовать classList A, если true, или classList B, если false.

Трудно найти хорошие примеры условных CSS. Какие-нибудь мысли?

Answer 1

Условные CSS-классы работают следующим образом:

h("li.nav-menu-item", {
  "classes": {
    "nav-menu-item-is-active": this._activeNavElementId === navItem.id
  }
}