2

我一直在努力解决查询问题。假设我想要一个Root带有多个表视图的组件。

官方教程建议- 一种方法是使用没有查询的表视图组件。然后你可以通过 props 传递它需要使用的任何数据，这很好用。

但这是非常简单的情况。在非平凡的应用程序中，您可能希望TableView使用查询，因为在 UI 树下，您可能有一些复杂的 UI 组件结构 - 表头、页脚、行、单元格等。现在本教程建议使用一个问题：

然而，这仍然是一些简化的例子。所以假设我有：

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

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

在实际应用程序中，数据当然来自后端，Om 会将其粘贴到状态原子中（像往常一样）

现在我需要一个带有查询TableView的组件，该组件可以呈现其中任何一个（或本例中的任何序列）。所以你看我必须以某种方式告诉组件使用状态 atom 中其他地方的数据。并且查询应该是“动态的”，所以我可以使用多个渲染不同的数据。TableViewTableViewTableViews

假设我们对 Root 有这样的东西：

(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)]]))))

为了酿造，我省略了 Om.Next 接口

现在我有几个问题：

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

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

4

1 回答 1

0

所以这就是我想出的：

对于每个表，存储一个与之关联的数据键，然后在读取阶段抓取该数据并将其关联到表示该表的映射：

因此，如果我们有几个表（奇数和偶数）：

    {: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)}))

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

整个解决方案的片段在这里：

upd：我做了一个改进的版本（在要点中添加了一个文件）。在该示例中，您现在可以指定数据键，因此它只会加载指定的片段

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

于 2017-01-03T05:54:02.983 回答