Cljs re-frame is not showing element as expected

Question

I'm experimenting with Cljs re-frame, in which I'm trying to show a cell in UI with the below function,

(defn cell
      [{:keys [id value on-change]}]
      [(r/adapt-react-class Box) {:key              id
                                  :type             :number
                                  :ml               2
                                  :content-editable (nil? value)
                                  :on-change        on-change
                                  :border           "2px solid #10AF34"
                                  :width            "30px"
                                  :height           "30px"
                                  :align            "center"}
       value])

When I try to call the method directly from a method that is being invoked for rendering, it works,

(defn app
      []
      (cell {:id        "1-1"
             :value     nil
             :on-change #(js/alert "in cell 1 1")}))

Whereas, when I try to wrap it in another method and call, it is not working

(defn grid
      [data]
      (cell {:id        "1-1"
             :value     1
             :on-change #(js/alert "in cell 1 1")}))

(defn app
      []
      (grid (generate-data)))

If someone wants to try it out, the grid/cell is available here and the app/rendering function is available here.

Answer 1

Your issue might stem from using [(r/adapt-react-class Box) …] - I‘m not sure it’s problematic, but I‘d either def the result of adapt-react-class and reuse it, or use the [:> Box …] syntax.