Reagent 不会在 let 内部使用 deref-ing 重新渲染组件

Question

我有原子foo:

(defonce foo (r/atom "foo"))

我有父组件：

(defn parent-component []
  (js/setTimeout #(reset! foo "bar") 5000)
  (child-component {:foo foo}))

我有子组件：

(defn child-component [props]
  (let [derefed (deref (:foo props))]
    (fn []
      [:div
       [:p derefed]
       [:p (deref (:foo props))]])))

重置后仅更新第二段 foo。

为什么会这样？

Answer 1

来自关于 Form-2 组件的重构文档：https://github.com/Day8/re-frame/wiki/Creating-Reagent-Components#form-2--a-function-returning-a-function。

需要在内层函数中再次重复外层函数参数：

(defn child-component [props]
  (fn [props]
    (let [derefed (deref (:foo props))]
      [:div
       [:p derefed]
       [:p (deref (:foo props))]])))

Reagent 不会在 let 内部使用 deref-ing 重新渲染组件

Reagent doesn't rerender component with deref-ing inside of let

javascript

clojure

clojurescript

reagent

re-frame