How do you call a native react component with js props (without clj->js conversion)? When I’m doing this [:> NativeComponent #js {:js-key []}] the props are being passed in as children.

looks like (r/adapt-react-class NativeComponent also either does a clj->js conversion or it passes #js props in as children. Huh. Is this a bug?

@seantempesta what's buggy about it?

[:> NativeComponent {:a 1}] ; calls NativeComponent with (clj->js {:a 1}) as the props [:> NativeComponent #js {:a 1}] ; calls NativeComponent with nil as props and #js {:a 1} as the children

what behavior would you expect? Reagent props must be a clj map

you could probably avoid the js->clj clj->js roundtrip...

I want to call the NativeComponent with a js-obj as the props AND a clj datastructure embedded inside that js-object.

NativeComponent isn’t a Reagent component.

but you're using Reagent call-style (`:>` treats the native component like a reagent component)

Well, I don’t know how to call a native component within a Reagent component without using :>

hm... you could do [:> (fn [] (js/React.createElement NativeComponent #js {:a 1})] or something like that

or even [:> (js/React.createElement ..)] perhaps?

Hmm okay. But shouldn’t [:> NativeComponent #js {:a 1}] work?

I remember seeing adapt-react-class work with #js {:a 1} passed as first argument

but not 100% sure

I think I tried that and it did the same behavior: it moved the props to the children.

Okay, this is working:

[:> View {:flex            1
                :height          100
                :width           100
                :backgroundColor "red"}
       (r/create-element VirtualizedList #js {:data                  [{:a 1}]
                                              :renderItem            #(r/create-element render-list-element %)
                                              :debug?                true
                                              :disableVirtualization true
                                              :getItem               get
                                              :getItemCount          count
                                              :keyExtractor          #(str (get %1 :db/id))})]

This is kind of documented here: https://reagent-project.github.io/news/news050.html

I think that as-element, :> and adapt-react-class can be seen as specializations of create-element

:> is convenient, but if you need an advanced feature (like passing raw JS objects), you need to drop down to create-element

hi, could anyone explain why the second snippet (`home1`) has the behaviour of making requests in a loop?

render functions should be pure. Move side effects to life-cycle methods or the outer fn in a Form-2 componenet.

@pesterhazy, as I have it in home definition, right?

yes