数据源属性不会从试剂传播到React Native ListView组件的render方法

Question

我正在尝试在试剂中呈现React Native ListView.

我有以下代码段:

(def data-source
 (React.ListView.DataSource. #js{:rowHasChanged (fn [a b] false)}))

(defn render-row []
  [ui/view])

(def rows
  (clj->js ["whoa", "hey"]))

(defn main-scene []
  (fn []
    [ui/list-view {:render-row render-row
                   :data-source (.cloneWithRows data-source rows)}]))

上面导致"失败的propType:dataSource未指定所需的prop ListView.检查渲染方法app.ios.ui.main_scene." 接下来是"无法读取未定义的属性'rowIdentities',因为数据源在ListView的render方法中未定义.

我的第一个猜测是在试剂/打嗝或其他任何东西的某个地方对某些"数据"属性进行了一些特殊处理,但我找不到为什么该属性没有正确传播的单一线索.

而且,是的,(.cloneWithRows data-source rows)实际上返回一个有效的ListViewDataSource对象实例.

然后,如果我通过:data-source,:dataSource我得到的是一个令人费解的"StaticRenderer.render():必须返回一个有效的ReactComponent.你可能已经返回了undefined,一个数组或一些其他无效对象."

我使用react-native 0.18.1和reagent 0.5.1用re-frame 0.6.0.我曾与选中此reagent 0.6.0-alpha和re-frame 0.7.0-alpha,得到了相同的错误.

我一直在挖这个几个小时,我想我需要一些帮助.尝试修复此问题的任何提示/想法,代码中的任何引用都要查看？非常感谢提前.

Answer 1

好吧,第一件事是数据源应该传递给视图:dataSource而不是传递给视图:data-source.后者因任何原因都不起作用.作为旁注,渲染行方法既可以作为:render-row或传递:renderRow,也可以两种方式工作.嘿.

其次,该render-row函数应该返回一个React组件而不是一个数组.后者如果稍后由试剂渲染数组会没问题,但是listview不会对从render-row获取的数据进行任何类型的后处理,只是尝试将其返回到React,如果它是普通的clojure数组.

所以上面的render-row函数应该写成:

(defn render-row []
  (r/as-element [ui/view]))

然后一切正常.:)