我对 Clojure 和 Compojure Web 开发比较陌生。我在构建的玩具示例中注意到的第一个问题是 HTML 模板问题。我想支持 Rails 中的部分或 Django 使用的模板框架。
目前我有:
(defn index-page []
(html5
[:head
[:title "Home | Compojure Docs"]
(include-css "/css/bootstrap.min.css")
(include-css "/css/bootstrap-responsive.min.css")]
[:body
[:div {:class "container-fluid"}
[:div {:class "row-fluid"}
[:div {:class "span2 menu"}]
[:div {:class "span10 content"}
[:h1 "Compojure Docs"]
[:ul
[:li
[:a {:href "/getting-started"} "Getting Started"]]
[:li
[:a {:href "/routes-in-detail"} "Routes in Detail"]]
[:li
[:a {:href "/destructuring-syntax"} "Destructuring Syntax"]]
[:li
[:a {:href "/nesting-routes"} "Nesting Routes"]]
[:li
[:a {:href "/api-documentation"} "API Documentation"]]
[:li
[:a {:href "/paas-platforms"} "PaaS Platforms"]]
[:li
[:a {:href "/example-project"} "Example Project"]]
[:li
[:a {:href "/example-project-on-cloudbees"} "Example Project on CloudBees"]]
[:li
[:a {:href "/interactive-development-with-ring"} "Interactive Development with Ring"]]
[:li
[:a {:href "/emacs-indentation"} "Emacs Indentation"]]
[:li
[:a {:href "/sessions"} "Sessions"]]
[:li
[:a {:href "/common-problems"} "Common Problems"]]]
(include-js "/js/jquery-1.9.1.min.js")
(include-js "/js/bootstrap.min.js")]]]]))
(defn routes-in-detail []
(html5
[:head
[:title "Routes in Detail | Compojure Docs"]
(include-css "/css/style.css")]
[:body
[:h1 "Routes in Detail"]]))
有没有让我不重复代码的好方法?我希望 HEAD 标记中的内容位于它自己的模板文件或函数中,然后能够在我进行时包含它。例如,我想将它包含在“详细路线”功能中。我看过 Enlive,但我不确定如何将它与 Hiccup 一起使用。对此处最佳实践的任何想法将不胜感激。
最佳答案
您可以将部分标记提取到单独的变量中:
(def head
[:head
[:title "Home | Compojure Docs"]
(include-css "/css/bootstrap.min.css")
... ])
(defn routes-in-detail []
(html5
head
[:body
... ]))
如果你需要你的代码片段/部分来接受参数,你可以把它变成一个函数,例如:
(defn head [title]
[:head
[:title title]
(include-css "/css/bootstrap.min.css")
... ])
(defn routes-in-detail []
(html5
(head "Routes in detail")
... ))
有时您会希望您的“片段”包含多个顶级元素而不是单个元素。在这种情况下,您可以将它们包装在一个列表中 - hiccup 将内联展开它:
(defn head-contents [title]
(list [:title title]
(include-css "/css/bootstrap.min.css")
... )))
(defn routes-in-detail []
(html5
[:head (head-contents "Routes in detail")]
[:body ... ]))
一旦您意识到 hiccup 标记是由简单的 clojure 数据结构构成的,您就会发现使用函数操作/构建它是简单而灵活的。
关于clojure - 使用 Hiccup 和 Compojure 编写模板,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/15388345/