Clojurians Log v2

I’m getting an “encountered children with the same key ‘null’, with the following code:

(defn video-comp [video]
  [:> View {:key (get video "uri")}
   [:> Video
    {:style {:height 400
             :width "100%"}
     :controls true
     :paused true
     :source {:uri (str "<https://d211alragp6msc.cloudfront.net/>" (get video "uri"))}}]
   #_[:&gt; Text {:style {:fontSize 20}} (get video "name")]
   #_[:&gt; Text (get video "description")]])

(defn home []
  (dispatch [:load-videos])
  [:&gt; SafeAreaView {:marginBottom 100}
   [:&gt; Button {:title "Refresh" :onPress #(dispatch [:load-videos])}]
   [:&gt; FlatList {:data @(subscribe [:videos])
                 :renderItem (fn [item] (r/as-element [video-comp (get (js-&gt;clj item) "item")]))
                 :keyExtractor (fn [item] (-&gt; (get (js-&gt;clj item) "item")
                                              (get "uri")))}]
   [google-signout-comp {:key :signout}]])

@ps The message come from the :keyExtractor line in your home component. Tried something like that:

...
:keyExtractor (fn [item] (str (get-in (js->clj item) ["item" "uri"])))}]
...

You can remove your video-comp :key line.

@ps Take a look here: https://github.com/raspasov/alexandria-clj/blob/a68ef10ca1104d9f74380265818cb22fd328499c/src/ax/react_native/virtualized_list.cljs Specifically, :getItem and :keyExtractor I prefer to use VirtualizedList directly, because it allows to use custom data sources (like ClojureScript’s immutable vectors) directly without transformation. It does require a bit of setup initially but works well afterwards.

How is it different from what I have already?

@admin055 i tried this but I still get the warning

@raspasov I don’t understand, clojurescript data structures can be passed into flatlist as well in the :data key

in any case is there a way to get rid of the warning using a flatlist?

First, ii use get-in to access nested map instead thread marco + get and second it converts the result in string with str.

Please, print out the item object and paste the result here with

...
:keyExtractor (fn [item] (js/console.log item)))}]
...

Or more directly, copy/paste the state return by @(subscribe [:videos])

@ps The :key-extractor in my FlatList is (comp str :uuid cljify) where cljify is (js->clj % :keywordize-keys true)