:on-click 呈现为文本答案

【问题标题】：:on-click renders as text:on-click 呈现为文本
【发布时间】：2019-09-12 12:16:15
【问题描述】：

我的 ClojureScript 函数：

(defn node-function [node]
  [:<>
   [:div (node :name) {:on-click #(prn "hi")}]])

在 DOM 中呈现为 HTML 文本：

My Documents{:on-click #object[Function]}

我的代码看起来与我在网上找到的 :on-click 示例完全相同。

为什么编译器认为这是文本而不是函数？

【问题讨论】：

你能链接到你正在关注的例子吗？ :)
当然 - reagent-project.github.io - 搜索 on-c。
好吧，看起来没问题。我不熟悉 [:<> 虽然它有什么作用/为什么需要它？。
嗯，现在我掌握了这里，但是您是否将节点用作函数名和参数，而编译器会在某个地方感到困惑？
您的其他问题中的文档you yourself linked 怎么样？如您所见，道具映射（对应于 React 道具）始终是打嗝形式的第一个参数。实际上你在这里想要什么并不是很清楚，特别是因为你的函数和它的参数都有相同的名称。

【解决方案1】：

我不确定您项目的其余部分是如何构建的，但看起来您尝试渲染的 div 的属性映射和内部 html 已转置。

渲染模型出现这种方式的原因是，试剂看到:div 向量的第一个孩子不是地图（它可能是一个字符串）并将所有剩余的孩子解释为发射的其他孩子div 在 html 中，将它们串起来。

您可能正在寻找一个更像这样定义的函数：

(defn node-function [node]
  [:div {:on-click #(prn "hi")} (:name node)])

我删除了 :<> 位，因为这里不需要它，因为此组件中只有一个 div。

我转置了 node 和 :name 使其更加零安全，并使名称查找更清晰。

【讨论】：

Reagent 中的兴趣点:<> 会生成一个Fragment，如果您需要在没有包含元素的情况下呈现多个元素。你是对的，这里不需要它，但如果他的组件有多个 div，他需要一个。
谢谢，很高兴知道！我已经相应地编辑了答案。