了解Om查询和UI组合

问题描述：

我一直在试图围绕查询包裹头部。假设我想要一个带有多个表视图的Root组件。了解Om查询和UI组合

official tutorial suggests - 一种方法是拥有一个没有查询的表视图组件。然后你可以传递需要通过道具使用的任何数据，而且工作得很好。

但这是非常简单的情况。在非平凡的应用程序中，可能您希望TableView带有查询，因为在UI树下可能有一些复杂的UI组件结构 - 表头，页脚，行，单元格等。现在this tutorial建议采用方法与查询：

但这仍然是一个简化的例子。所以我们可以说，如果我有：

当然，在真正的应用程序

(defmethod read :numbers/odd [_ _ _] 
    {:value (filter odd? (range 50))}) 

(defmethod read :numbers/even [_ _ _] 
    {:value (filter even? (range 50))})

的数据将来自后端和OM将它粘成的状态原子（像往常一样）

现在我需要使TableView组件与查询可以呈现其中任何一个（或在这种情况下的任何序列）。所以你看我不得不告诉TableView组件使用位于状态原子的其他地方的数据。 TableView的查询应该是“动态的”，所以我可以使用多个TableViews呈现不同的数据。

比方说，我们希望有这样的事情作为根：

(defui Root 
    (query [_] [{:table/odd ,,,} {:table/even ,,,}]) 
    (render 
     [this] 
     (let [{:keys [table/odd table/even]}] 
     (html [:div 
       [:div.odds (ui-table-view odd)] 
       [:div.evens (ui-table-view even)]]))))

为brewity我省略Om.Next接口

现在我有几个问题：

Root的查询应该如何查看？
我应该在参数TableView（我可能会指出状态原子中的数据的关键字）查询？或者我怎么能告诉一个TableView使用:numbers/odd而另一个使用:numbers/even？
如果我在TableView中使用参数化查询，那么如何将参数Root传递到TableView？
也许我应该通过计算道具传递数据或链接到TableView的数据？
如何使用om/get-query（如果子查询是参数化的）？
读取方法如何？我是否需要在原子read处“移动东西”？听起来不是一个好主意

有人可以给我看一个例子。非常感谢！。

答

所以这就是我想出：

对于每个表店与它，然后在读阶段抢相关数据的关键数据和assoc命令到地图表示表：

所以如果我们有情侣对表（含单双号）：

{:app/tables 
    [{:id  0 
     :title "Odd numbers" 
     :data-key :data/odds} 
     {:id  1 
     :title "Even numbers" 
     :data-key :data/evens}]}

这会有什么阅读方法如下所示：

(defmethod parsing/read :app/tables 
     [{:keys [state parser] :as env} k _] 
     (let [ts    (get @state k) 
      merge-table-data' (fn [{:keys [data-key] :as t}] 
           (assoc t :table/data 
             (->> data-key 
              vector 
              (parser env) 
              vals 
              flatten)))] 
     {:value (map merge-table-data' ts)}))

这种方法有一个很大的缺点 - 它会尝试解析所有表的所有数据，所以我需要找到一种方法来改善它 - 我希望能够有选择地指定表来抓取数据。

片断为整个溶液是here：

UPD：我提出的改进版本（添加的文件的要旨）。在这个例子中，现在你可以指定数据键，所以它只会加载指定的部分

upd2：显然这种方法以某种方式打破了突变。这个想法是正确的 - 需要利用Om.Next的规范化机制。我会稍后尝试更新要点。

了解Om查询和UI组合

相关推荐