secretary icon indicating copy to clipboard operation
secretary copied to clipboard

preventing navigation on clicking anchor tag with href

Open jdkealy opened this issue 8 years ago • 1 comments

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

jdkealy avatar May 27 '16 22:05 jdkealy

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

njj avatar May 22 '19 15:05 njj