Wie kann ich den CSS-Klassennamen dynamisch mit Reagenz ändern?

Question

Über reagent.

Ich muss einige CSS-Klassennamen dynamisch ändern. Wie soll ich das machen?

Beispielcode ist hier.

(defn app [] 
    (let [array [1, 2, 3]] 
    (fn [] 
     [:div 
     (for [index array] 
     ;; I wanna change this classname like `item-1, item-2, ...` 
     ^{:key index} [:div.i-wanna-change-this-classname-dynamically index])]))) 

Answer 1

ändern

[:div.i-wanna-change-this-classname-dynamically index] 

zu

[:div {:class (str “item-” index)} index] 

Reagenz liefert eine Kurz Syntax von :div.class1.class2#id, aber Sie können auch diese in einer Karte als erstes Element in dem Vektor nach :div gesetzt.

Denken Sie auch an den CSS-Selektor :nth-child() als eine weitere Option für dynamisches Styling.