0

strangely my component-lifecycle functions are not called when I define a component as a function with the hooks as meta-data (the example is as easy as that - like in the examples I saw around).

(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 })
  )

When I create the component with reagent/create-class it works fine. I'm using the Reagent 0.6.1.

Solution found: you need to define the component as a Var instead of a function:

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

then it works fine - really odd.

If anyone could explain why?

regards, fricke

fricke
  • 1,330
  • 1
  • 11
  • 21

1 Answers1

1

The first attempt didn't work because meta information corresponds to a returning value (which can not be seen from outside), while in the second attempt it corresponds to the value itself (and can be seen).

Usually when you do have any method beside render it would be better to recourse to the full component syntax:

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

Yes, it is much more verbose, but at least you can instantly say what is going on.

akond
  • 15,865
  • 4
  • 35
  • 55
  • so does this mean that the analysis is done when Reagent is reading `[my-combo]`. And only when it is mounted, it is called, which is too late to add the react.js hooks? – fricke Apr 24 '17 at 18:02
  • I think that is the case. – akond Apr 24 '17 at 19:20