如何在 Reagent 中编辑 Reitit 路线?

How do I edit Reitit routes in Reagent?

使用默认试剂模板创建的路线如下所示:

;; -------------------------
;; Routes

(def router
  (reitit/router
   [["/" :index]
    ["/items"
     ["" :items]
     ["/:item-id" :item]]
    ["/about" :about]]))

如果我改变一个路径(下面的“/about”到“/test”),为什么它不再有效?一定有其他东西在驱动路由,但我似乎无法弄清楚是什么。

;; -------------------------
;; Routes

(def router
  (reitit/router
   [["/" :index]
    ["/items"
     ["" :items]
     ["/:item-id" :item]]
    ["/test" :about]]))

这是默认的试剂模板(lein new reagent...),我没有更改代码中的任何其他内容。任何帮助将不胜感激。

编辑 - 一些额外的细节 我在这个函数中(来自默认模板)在 repl 中搜索了一下:

(defn init! []
  (clerk/initialize!)
  (accountant/configure-navigation!
   {:nav-handler
    (fn [path]
      (let [match (reitit/match-by-path router path)
            current-page (:name (:data  match))
            route-params (:path-params match)]
        (reagent/after-render clerk/after-render!)
        (session/put! :route {:current-page (page-for current-page)
                              :route-params route-params})
        (clerk/navigate-page! path)
        ))
    :path-exists?
    (fn [path]
      (boolean (reitit/match-by-path router path)))})
  (accountant/dispatch-current!)
  (mount-root))

我觉得一切正常。事实上,在 repl 中执行以下步骤成功地将浏览器导航到正确的页面。不过我还是不能直接输入URL。

app:problem.core=> (require '[reitit.frontend :as reitit])
nil
app:problem.core=> (reitit/match-by-path router "/test")
{:template "/test",
 :data {:name :about},
 :result nil,
 :path-params {},
 :path "/test",
 :query-params {},
 :parameters {:path {}, :query {}}}
app:problem.core=> (def match (reitit/match-by-path router "/test"))
#'problem.core/match
app:problem.core=> (:name (:data match))
:about
app:problem.core=> (:path-params match)
{}
app:problem.core=> (def current-page (:name (:data match)))
#'problem.core/current-page
app:problem.core=> (page-for current-page)
#'problem.core/about-page
app:problem.core=> (session/put! :route {:current-page (page-for current-page) :route-params {}})
{:route {:current-page #'problem.core/about-page, :route-params {}}}
app:problem.core=>

您似乎在 src/cljs/<project_name>/core.cljs 中更改了客户端的路由,但没有在 src/clj/<project_name>/handler.clj 中更改服务器端的路由(查看靠近底部的 def app文件)。

如果您不熟悉使用 Clojure 开发 Web 应用程序,我建议您查看 Luminus,而不是使用 Reagent 模板。这是一种包含更多电池的方法,有更多的文档。 《Web Development With Clojure》一书是同一作者(也是Reagent的贡献者)所著,也推荐阅读