reactjs - : "^{:key item}"的用途

Question

我正在阅读http://reagent-project.github.io/

有一段代码:

(defn lister [items]
  [:ul
   (for [item items]
     ^{:key item} [:li "Item " item])])

^{:key item} 的含义是什么？我们为什么需要它？[文档提到使 Reflect 更快。]

Answer 1

React 需要识别各个列表项，以便它可以知道哪些列表项已更改。否则，React 在重新渲染时只能丢弃整个列表。因此，您需要添加一个 key 。

在 React (JSX) 中:

<li key={item.whatever}>
  {item.bar}
</li>

在试剂中，您将 key 作为元数据添加到 Hiccup 表单中。然后，Reagent 负责设置 React 的 key 。

^{:key (.-whatever item)} [:li (.-bar item)]

您可以使用任何唯一标识列表元素内容的内容。在 ClojureScript/Reagent 中，您通常使用该项目本身。