1

有人可以帮助我更好地理解组件、查询等。我正在为一项看似微不足道的任务而苦苦挣扎,我需要一个带有参数化查询的组件。该组件的实例需要包含在父组件中,例如,我想要需要在一组孩子之间分配的不同种类的水果列表,每行将显示孩子的名字和一种水果的数量:

  (defui FruitsLedger

    static om/IQuery
    (query [this]
      '[(:data/fruits) {:kind ?kind}])

    Object (render [this]
            (let [{:keys [data/fruits]} (om/props this)]
              (dom/ul nil (apply #(dom/li nil (str "for " (% :kid) " " (% :qt))))))))

现在我需要让我们在另一个组件中说这个组件的两个实例

在哪里:params

第一种情况是:{:kind :apples}

第二种情况是:{:kind :oranges}

这应该呈现与此类似的 2 个列表:

  | apples        | oranges       |
  |---------------+---------------|
  | for Aaron 2   | for Katie 1   |
  | for Dan 1     | for Rob 3     |
  | for Charles 0 | for Charles 3 |
  |               |               |
  |---------------+---------------|
4

1 回答 1

1

我确信参数化查询有其用途。但是,也许这个问题和其他类似的问题可以在不求助于它们的情况下得到解决。

:app/fruit-query-kinds你的数据库(默认数据库格式)。这将是一份水果清单。您已经有了水果组件,但您将需要另一个组件,该组件具有作为查询目的的水果种类列表的想法。给这个组件一个查询和一个标识。它是否要显示并不重要。最重要的是让数据结构正确。它的 ident 就像: '[:fruit-query-kind/by-id 1100],它可能由'[:fruit/by-id 10]and组成'[:fruit/by-id 20]。根据您的示例,10 将是苹果的 id,20 是橙子的 id。这将是 key 的 refs 值(默认数据库存储中的标识向量):app/fruit-query-kinds。1100 只是一个唯一的数字,预计不会改变。

数据结构是重要的东西,一切都可以在其中建模,甚至查询参数

您将需要突变和一些按钮(或其他输入)调用transact!某处直接更改数据库中的水果查询类型。如果您不需要任何重新渲染即可transact!使用应用程序的协调器而不是组件进行调用。

这个想法是,您可以让组件查询用户先前所做的选择。所以你的第一个列表组件不会知道它是用于苹果的 - 它只知道它是显示第一个水果查询类型的水果。

我发现您可以根据需要在视图和数据库之间进行尽可能多的来回操作,让数据库不仅存储数据,还存储视图的当前状态。到目前为止,我遇到的唯一一次麻烦是当我错误地处理not组件查询中的布尔键时。当然,这最终以永远闪烁的屏幕告终。

在我看来,在客户端上简单地使用 Om Next 的方式是让您的所有读取看起来完全相同,全部使用db->tree. 一旦你接受了这种方法,下一步就是一起摆脱它们,你可以通过切换到 Untangled 框架来做到这一点。

于 2016-05-18T03:29:59.323 回答