2015-06-23 6 views
4

Я хочу добавить обработчик по клику для каждого элемента в моем списке.обработчик on-click для элемента списка reagent 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]]) 

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

ответ

5

Ваш пример не работает, потому что вы должны передать функцию: на щелчок, как это:

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

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

это эквивалент

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

Edit:

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

(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")) 

Метка на дне обновляется, когда элемент в списке щелкают.

+0

Это имеет смысл, но я попробовал оба без везения в изменении атома в ui, к какому элементу списка был нажат. –

+0

Я могу запустить его, и он работает для меня. Просто чтобы убедиться, что я отредактировал ответ и вставил все свое решение здесь. –

+0

Теперь это работает, я, должно быть, совершил небольшую ошибку. Благодаря! –

Смежные вопросы