Fork me on GitHub
#reagent
<
2018-07-17
>
urbanslug08:07:44

Anyone know why this would work in a shadow repl but fail in a component (-> row vals string/join) vals gives an error that row is not a function but row is a dict

Hukka12:07:11

Could someone explain why [:> Test {:foo-bar "bar"} results in the Test getting props of {'fooBar': 'bar'} but [:> Test #js {:foo-bar "bar"} {'children': {'foo-bar: 'bar'}

Hukka12:07:27

This was a huge pain in the ass. In the end I wrote a small JS component that prints the props, since I didn't figure out a way to see which way reagent really passes props to react components

valtteri12:07:58

I guess it’s because in reagent props must be in a clojure map and

(map? #js{:a 2})
=> false
And because reagent doesn’t recognize js object as props it’s interpreted as children that should be passed to the component.

pesterhazy14:07:14

Yeah, the props map itself needs to be a map?; anything below that can also be a js datastructure. Agree that this is hard to grok and not well documented @tomi.hukkalainen_slac

abdullahibra14:07:30

can i do something like : (defn all-things [] (fn [] (doall (for [x l] [:h1 (:name x)}])))) and then [all-things] ?

abdullahibra14:07:54

and what is the meaning of this error: uncought error: Objects are not valid as React child (found: object with keys (name, id, class)) if you meant to render a collection of children, use an array instead.

gadfly36115:07:27

@abdullahibra try wrapping the doall with a [:div ... ]

valtteri15:07:09

Common patterns is to do something like this

(into [:div] (for [i (range 5)]
                      [:h1 (str i)]))

abdullahibra15:07:30

@gadfly361 @valtteri great thanks guys 🙂

👍 8
Hukka19:07:15

I think the fact that reagent/create-element will take an #js "map" is the mental mismatch

Hukka19:07:11

It is clear that : > will just convert it to reagent component, which then needs a clojure map, but the magic could go either way

Hukka19:07:24

And some kind of warning would be really nice, at least in dev mode

juhoteperi19:07:06

I'm not sure it would be possible to give warning in this case. Both uses are valid but mean different things.

justinlee22:07:39

you know i’ve been telling people to use that into pattern but you can also just drop the sequence in directly. the only issue is that it requires a key