Как переключить класс в элементе dom, используя clojurescript или om-next

Я новичок в clojurescript, и у меня есть задача создать фильтр с требованием переключать элементы списка при нажатии на значок плюса. Я написал css, чтобы скрыть, когда класс неактивен, и показать, когда он активен. Я просто хочу знать правильный синтаксис, как переключать класс по клику, используя clojurescript или om-next.

Или есть какой-либо способ переключить (очистить / заполнить) массив списка по щелчку элемента родного / другого (h3).

Я пробовал что-то вроде этого.

[:h3 (:name aggregation) {:on-click #(swap! :className "dInline" "dNone")}]

Это фактический код.

(defn render-aggregation
    [{navigation-dimension :field :as aggregation} toggle-expanded rendered-filters]
        (let [show-expanded? (> (count (:values aggregation)) 8)]
            [:li {:key (str "k-" navigation-dimension)}
                 [:h3 (:name aggregation)]
                     (cond-> (into [:ul.list-unstyled] rendered-filters)
                         show-expanded?
                         (conj [:li
                             [:button.btn.btn-default.btn-xs {:on-click (toggle-expanded aggregation)}
                                 (if (:ui/expanded? aggregation) "show fewer" "show more")]]))]))

Фактический результат - элемент h3 должен изменить свой класс на "dNone" при клике

0 ответов

Я могу представить два решения, использующих vanilla JS:

  1. Вы можете найти этот ответ полезным. Однако для этого требуется, чтобы элемент (ваш h3) имел идентификатор.
  2. Если у вас нет идентификатора, вы можете использовать JavaScript thisключевое слово, которое очевидно доступно из ClojureScript (см. здесь)

Я успешно использовал метод №1 в некоторых своих кодах упражнений, но я новичок в ClojureScript и веб-разработке в целом... пожалуйста, обращайтесь с моим ответом осторожно.

Ура

Оливер

Другие вопросы по тегам