在Om中使递归组件工作的问题?

时间:2014-03-28 23:10:09

标签: recursion clojure clojurescript om

我有以下内容:

(ns commentz.client
    (:require
     [om.core :as om :include-macros true]
     [om.dom :as dom :include-macros true]
     [clojure.browser.repl]))

(def app-state
  (atom
   {:id "a"
    :value "I am the greatest of comments!"
    :user "1"
    :anonymous false
    :score 10
    :children
    [{:value "I am ok too."
      :user "1"
      :anonymous false
      :score 4
      :children
      [{:value "I am the second greatest comment"
        :user "2"
        :anonymous false
        :score 7
        :children {}}]}
     {:value "I like turtles"
          :user "3"
          :anonymous true
          :score -3
          :children {}}]}))

(defn header [app owner]
  (dom/div #js {:className "header"}
           (dom/div #js {:className "vote"}
                    (dom/div #js {:className "up"})
                    (dom/div #js {:className "down"}))
           (dom/a #js {:className "username" :href (:user app)} (:user-name app))
           (dom/div #js {:className "score"} (:score app))))

(defn footer [app owner]
  (dom/div #js {:className "footer"}
           (dom/a #js {:className "permalink" :href (str "#" (:id app))} "permalink")
           (dom/a #js {:className "reply"} "reply")))

(defn comment [app owner]
  (reify
    om/IRender
    (render [this]
      (dom/div {:id (:id app) :className "comment"}
               (header app owner)
               (dom/div #js {:className "value"} (:value app))
               (footer app owner)
               (om/build-all comment (:children app))))))

(om/root comment app-state {:target (. js/document (getElementById "app"))})

上面的代码确实成功编译,但我没有看到任何递归。相反,当我使用浏览器进行检查时,我会看到以下内容。

10 
I am the greatest of comments! 
permalink reply 
0 32374988

我认为32374988可能是一个对象哈希,不知道0是什么。无论如何,我的意图也是看到所有4条评论都出现了,其中一些评论嵌套在其他评论中。目前我只获得根评论,加上一些奇怪的0 32374988,其中递归建立的评论应该是。任何帮助表示赞赏。谢谢。

1 个答案:

答案 0 :(得分:7)

(om/build-all)返回seq。试试(apply dom/div nil ...)

(apply dom/div {:id (:id app) :className "comment"}
           (header app owner)
           (dom/div #js {:className "value"} (:value app))
           (footer app owner)
           (om/build-all comment (:children app))))))