Clojurians
# om

This page is not created by, affiliated with, or supported by Slack Technologies, Inc.

souenzzo 07:01:48

``` (defui UserList Object (render [this] (let [list (om/props list)] ;(apply dom/ul nil (map user list)) (dom/div nil "ok") )))

(def user-list (om/factory UserList))

(defui Root static om/IQuery (query [this] [:app/counter :input/foo {:app/users (om/get-query User)}]) Object (render [this] (let [{:keys [app/users]} (om/props this)] (apply dom/div nil [(dom/h2 nil "List A") (user-list users) ])))) `` I'm trying to to this [https://github.com/omcljs/om/wiki/Components%2C-Identity-&-Normalization#something-to-look-at](https://github.com/omcljs/om/wiki/Components%2C-Identity-&-Normalization#something-to-look-at) But gettingUncaught Error: Assert failed: (component? component)Then I comment(user-list users)` everything renders ok.

levitanong 09:10:08

@souenzzo Line 4: (om/props list) should be (om/props this)

levitanong 09:10:28

You’re trying to get the om properties of cljs.core/list :stuck_out_tongue:

dirklectisch 09:21:43

@timovanderkamp @wilkerlucio Are you aware that you can pass a keyfn to factory? Just checking. https://github.com/omcljs/om/wiki/Documentation-%28om.next%29#factory

dirklectisch 09:22:43

After reading the react docs is personally just started assigning keys whenever I got that warning.

timovanderkamp 09:47:44

@dirklectisch Normally you only need to supply a key when you are rendering a collection of elements. But for this example it is not necessary: (dom/div nil (dom/span nil "title") (my-button {}))

If the container were a custom-component though, where you would render the children span and my-button by calling (om/children this) you would get the unique keys error.

timovanderkamp 09:47:59

(my-dialog {} (dom/span nil "title") (my-button {}))

timovanderkamp 09:48:22

Now you are forced to supply keys to all the children, which can be quite annoying

wilkerlucio 14:41:13

yes, but this is a case for container components, a lot of the children don't have enough information to have a proper ident, for example a simple separator component

wilkerlucio 14:42:00

also, after some investigation we noticed something weird, even if you don't use the children, sending a child without key to a component generated by an Om factory will trigger the problem

wilkerlucio 14:42:42

like this: ```(om/defui ^:once Container
Object (render [this] (let [{:keys []} (om/props this)] (dom/div nil "A"))))

(def container (om/factory Container))

(om/defui ^:once Child Object (render [this] (let [{:keys []} (om/props this)] (dom/div nil "Im Child"))))

(def child (om/factory Child))

(defcard key-issue (fn [] (container {} (child {}))))```

wilkerlucio 14:43:23

and in the end, this wazard can all be avoided, if when calling React.createElement we send then as position instead of a list, so to me seems like Om can solve

wilkerlucio 14:43:38

makes sense?