Search code examples
reagent

'key' property inside component function

I have the following case (reagent + react.js):

(defn row [data]
   [:li {:key (:id data :class "myclass")} (:text data)])

(defn list [rows]
  (map #([row %]) rows))

In runtime, I can see that react.js complains about missing 'key' attribute. Is there a way to specify key from a component function. I want raw to be a separate component function, since it may become quite big, with own lifce-cycle callbacks, etc.

Solution

  • Your code is almost correct. It should be:

    (defn row [data]
  [:li {:key (:id data) :class "myclass"} (:text data)])

    The end paranthesis should be after data and not "myclass".

    And your mapping can be rewritten as just (map row rows) since row is already a function taking one argument.