0

我是 Clojure/Clojurescript 和 Om 的新手,经过一番挣扎,我想出了这种方法来从 2d 矢量渲染表格:

(def app-state (atom {:world [[1 2 1] [2 1 1] [1 2 1]]}))

(defn cell
  [text]
  (om/component
    (dom/td nil text)))

(defn row
  [data]
    (om/component
      (apply dom/tr nil
        (om/build-all cell data))))

(defn world-view
  [data owner]
    (om/component
      (apply dom/table nil
        (om/build-all row (:world data)))))

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

我正在寻找有关如何使其更简洁或如何从一个组件函数创建整个表的指针。

4

3 回答 3

0

在下面找到示例。如果您想使用表头添加表头 uncommnet 表头部分。

(def app-state (atom {:world [[1 2 1] [2 1 1] [1 2 1]]}))

(defn world-view [{:keys [world]} owner]
  (reify
    om/IRender
    (render [this]
      (dom/div nil
        (dom/table nil
          #_(apply dom/thead nil
            (for [h (keys (first world))
                 :let [hs (str h)]]
             (dom/th nil hs)))
          (apply dom/tbody nil
              (for [r world]
            (apply dom/tr nil
               (for [c (vals r)
                     :let [cs (pr-str c)]]
                 (dom/td nil cs)))))))  )))

(om/root
  world-view
  @app-state
  {:target (. js/document (getElementById "app"))})
于 2014-05-21T14:18:54.953 回答
0

你总是可以用 lambda 替换无趣的函数:

(defn world-view [data owner]
  (om/component
   (apply dom/table nil
          (om/build-all (fn [data]
                          (om/component
                           (apply dom/tr nil
                                  (om/build-all (fn [data]
                                                  (om/component
                                                   (dom/td nil data)))
                                                data))))
                        (:world data)))))

或者在组件中给他们一个本地名称:

(defn world-view [data owner]
  (let [cell (fn [data]
               (om/component
                (dom/td nil data)))
        row (fn [data]
              (om/component
               (apply dom/tr nil (om/build-all cell data))))])
  (om/component
   (apply dom/table nil
          (om/build-all row
                        (:world data)))))
于 2015-08-04T01:37:43.367 回答
-1

使用 atom 作为参数时,您缺少 deref (@) 吗?clojure 中非常常见的错误。

你有 :

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

建议的解决方案:

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

于 2014-05-21T09:16:59.313 回答