How to use flat-list in re-natal?

Question

I have the following flatlist:

[flat-list {
                   :data [{:name "a"}
                          {:name "b"}
                          {:name "c"}]
                   :render-item (fn [item] [text (:name item)])
                   :key-extractor #(random-uuid)
                   }
        ]

But it's not working and gives me:

Invariant Violation: Objects are not valid as a React child (found: object with keys {name, id, class}). If you meant to render a collection of children, use an array instead.

What am I doing wrong?

-- EDIT --

Now I have the following:

        [flat-list {
                    :data [{:name "a"}
                          {:name "b"}
                          {:name "c"}]
                    :render-item (fn [item-]

                                   (r/reactify-component
                                    [text (:name item-)]
                                    ))
                    :key-extractor #(:name %)
                    :content-container-style {:align-items "center"}
                    }
         ]

But I get the error: Functions are not valid as a React child. This may happen if you returns a Component instead of <Component/> from render. Or maybe you meant to call this function rather than return it.

Using as-element instead doesn't give the error but also doesn't render the text components.

Answer 1

It's just because renderItem waits a react component

:render-item (fn [item] 
  (r/reactify-component [text (:name item)]))

:render-item (fn [item] 
  (r/as-element [text (:name item)]))