clojurescript - Om 如何渲染列表对象？

Question

我正在努力理解 om 如何使用 apply 来渲染列表项，如下面摘自 Om 教程页面的示例所示。

(om/root
  (fn [data owner]
    (om/component 
      (apply dom/ul nil
        (map (fn [text] (dom/li nil text)) (:list data)))))
  app-state
  {:target (. js/document (getElementById "app0"))})

我对 apply 的理解是，它需要一个函数和一个项目列表，并将该函数应用于该列表。但在这个例子中，理解将转化为将 dom/ul 应用于 nil。

我不明白的是:

• 为什么我要将 dom/ul 应用于列表，我不想创建 ul 元素，我想创建 li元素？
• apply 如何处理本例中发送的所有参数？

Answer 1

dom/ul 是一个生成 React 组件的函数，该组件将渲染相应的 DOM 元素。 dom/ul 的第一个参数指定您希望 DOM 元素具有的属性。例如，如果您想要 dom/ul要将类属性设置为“main”，您可以执行以下操作:

  (apply dom/ul #js {:className "main"}
    (map (fn [text] (dom/li nil text)) (:list data)))

将 nil 传递给 dom/ul 的第一个参数只是不设置任何 DOM 属性。

Clojure apply 调用dom/ul通过将所有参数(在dom/ul参数之后)添加到最终列表(由map生成)参数并将结果作为参数传递给dom/ul 。

举个例子，假设数据具有以下值:

["Apple" "Bird"] 

然后dom/ul在您的示例中最终将被调用为:

(dom/ul nil
    (dom/li nil "Apple")
    (dom/li nil "Bird"))

这将导致呈现以下 HTML:

<ul>
  <li>Apple</li>
  <li>Bird</li>
</ul>