Reagent :component-did-mount 挂钩未使用元注释的组件函数调用

Question

奇怪的是，当我将组件定义为函数并将钩子作为元数据时，我的组件生命周期函数没有被调用（这个例子就这么简单 - 就像我看到的例子一样）。

(defn my-callback [this] (println (.-innerHTML (reagent/dom-node this))))

(defn inner-compo []
  [:p "content"])

(defn my-compo []
  (with-meta inner-compo
             { :component-did-mount  my-callback })
  )

当我使用 reagent/create-class 创建组件时，它工作正常。我正在使用试剂 0.6.1.

找到解决方案：您需要将组件定义为 Var 而不是函数：

(def my-compo
  (with-meta inner-compo
             { :component-did-mount  my-callback })
  )

然后它工作正常 - 真的很奇怪。

谁能解释为什么？

问候，fricke

Answer 1

第一次尝试没有成功，因为元信息对应一个返回值（从外部看不到），而在第二次尝试中它对应于值本身（并且可以看到）。

通常，当您确实有 render 之外的任何方法时，最好求助于完整的组件语法：

  (reagent/create-class                 
       {:component-did-mount function...
        :component-will-mount function...
        :reagent-render render-function...

是的，它更冗长，但至少你可以立即说出发生了什么。

Reagent :component-did-mount 挂钩未使用元注释的组件函数调用

Reagent :component-did-mount hook not called with meta-annotated component function

clojurescript

reactjs

reagent