clj-commons / secretary

A client-side router for ClojureScript.
773 stars 64 forks source link

preventing navigation on clicking anchor tag with href #85

Open jdkealy opened 8 years ago

jdkealy commented 8 years ago

I just put together a minimal example recreating something I have been experienced. I was wondering if it were possible for clicking on an href not to retrigger the router. It seems that something in the secretary library is listening to the click event before my click handler has the chance to prevent it from doing so. Is it possible to keep the route's handler from being fired?

(ns minimal-example.core
    (:require [reagent.core :as reagent :refer [atom]]
              [reagent.session :as session]
              [secretary.core :as secretary :include-macros true]
              [accountant.core :as accountant]))

;; -------------------------
;; Views

(defn first-tab []
  [:div "FIRST TAB!"])

(defn second-tab []
  [:div "SECOND TAB!"])

(def selected-tab (atom nil))

(def tabs [{:key "one"
            :name "one"
            :cmp first-tab}
           {:key "two"
            :name "two"
            :cmp second-tab}])

(defn home-page []
  (reagent/create-class
   {:component-did-mount (fn []
                           (reset! selected-tab (-> tabs
                                                    first
                                                    :key)))
    :reagent-render (fn []
                      [:div
                       [:ul
                        (doall
                         (map (fn [item]
                                [:li
                                 [:a {:href "#"
                                      :on-click (fn [e]
                                                (reset! selected-tab (:key item))
                                                (.preventDefault e)
                                                (.preventPropogation e)
                                                false)}
                                  (:name item)]]
                                ) tabs))]
                       (doall
                        (map (fn [{:keys [key cmp]}]
                              (when (= key @selected-tab)
                                [cmp]))
                             tabs))])}))

(defn current-page []
  [:div [(session/get :current-page)]])

(secretary/defroute "/" []
  (session/put! :current-page #'home-page))

(defn mount-root []
  (reagent/render [current-page] (.getElementById js/document "app")))

(defn init! []
  (accountant/configure-navigation!
    {:nav-handler
     (fn [path]
       (secretary/dispatch! path))
     :path-exists?
     (fn [path]
       (secretary/locate-route path))})
  (accountant/dispatch-current!)
  (mount-root))
njj commented 5 years ago

@jdkealy I know this is super old, but did you ever figure this out?