обработчик щелчка для реагента элемента списка clojurescript

Я хочу добавить обработчик кликов для каждого элемента в моем списке.

(defonce selected-department (atom "department!"))

(defn sidebar []
  [:div#sidebar-wrapper
   [:ul.sidebar-nav
    [:li.sidebar-brand [:a {:href "#"} "Departments"]]

    ;;[:li [:a {:on-click (reset! selected-department "test!")} "Dairy"]]

    [:li [:a {:href "#"} "Dairy"]]
    [:li [:a {:href "#"} "Deli"]]
    [:li [:a {:href "#"} "Grocery"]]]])

Затем выбранный отдел - это метка, которую я хочу показать/использовать данные

(defn response-box []
  [:div#form_comparison
   [:label#dlabel @selected-department]])

Закомментированный фрагмент кода не работает. Есть ли способ заставить это работать?


clojure clojurescript reagent
person Michael Thurmond    schedule 23.06.2015    source источник

Ответы (1)


arrow_upward
7
arrow_downward

Ваш пример не работает, потому что вам нужно передать функцию :on-click следующим образом:

[:li [:a {:on-click #(reset! selected-department "test!")} "Dairy"]]

Так что единственное, что вам нужно изменить, это добавить # перед (reset!...

Это эквивалент для

 [:li [:a {:on-click (fn [_] (reset! selected-department "test!"))} "Dairy"]]

Изменить:

Это полный код, который я тестировал и отлично работает для меня:

(defonce selected-department (atom "department!"))

(defn sidebar []
  [:div#sidebar-wrapper
   [:ul.sidebar-nav
    [:li.sidebar-brand [:a {:href "#"} "Departments"]]
    [:li [:a {:on-click #(reset! selected-department "Dairy") :href "#"} "Dairy"]]
    [:li [:a {:on-click #(reset! selected-department "Deli") :href "#"} "Deli"]]
    [:li [:a {:on-click #(reset! selected-department "Grocery") :href "#"} "Grocery"]]]
 [:label @selected-department]])

(reagent/render-component [sidebar] (.getElementById js/document "app"))

Метка внизу обновляется при щелчке элемента в списке.

person Viktor K.    schedule 23.06.2015
comment
Это имеет смысл, но я безуспешно пробовал изменить атом в пользовательском интерфейсе на то, какой элемент списка был нажат. - person Michael Thurmond; 23.06.2015
comment
Я могу запустить его, и он работает для меня. Просто чтобы быть уверенным, что я отредактировал ответ и вставил сюда все свое решение. - person Viktor K.; 23.06.2015
comment
Теперь это работает, я, должно быть, где-то сделал небольшую ошибку. Спасибо! - person Michael Thurmond; 23.06.2015
comment
Мне все еще интересно, законно ли использовать реализацию функций JS, передавая fn0 вместо fn1. - person Leon Grapenthin; 23.06.2015