我是om.next(和clojurescript)的新手,我有以下问题。我只能使用协调程序获取要调用的根组件(即调用其查询方法);似乎需要使用props和om/factory
来调用其他所有组件。我想我错过了什么。
我正在尝试创建一个待办事项列表应用程序(原创性为100分!),并使用过滤器显示已完成/未完成/所有项目。如果我的TodoList
组件是根组件,我可以使用查询调用它:[:todos]
没有问题。我想要一个不同的根组件,并且还有一个Filter
组件通过协调程序。
我可以看到的可能选项:
有多个om / add-root!调用(这可以防止我们使用协调程序的嵌套组件,而不是我在教程中看到的模式)
将所有内容包装在全局组件中,并通过props将状态向下传递。但是这些例子使得阅读方法成为一种多方法,而这种方法并不存在。
这可能吗?谢谢!
答案 0 :(得分:1)
Om Next(以及其他诸如reframe)背后的概念是,有一个事实来源 - 您的应用状态。使用Om Next,应用程序的UI由一个(颠倒的)组件树组成。在渲染过程中,您的应用程序状态由Om Next解释其静态查询加载到您的Root
组件中。这个应用状态是作为'道具'收到的。你的工作就是将这些道具拆开并手工制作道具'在树的其余部分。您可以在每个组件的render
方法中执行此操作。
所以你的第二个选择是要走的路。 read
与静态组件查询中的关键字相关。如果您确保您的状态是默认数据库格式,那么事实上每个read
都可以以相同的方式实现,并使用db->tree
。拥有全局组件并使每个read
成为一个多方法都是不相关的概念,因而不是不相容的。事实上两者都是非常惯用的。
您可能希望查看ToDo应用程序示例以供参考:here和here。
需要注意的一点是,您的Root
组件查询将使用包含其他组件的连接,因此您的查询[:todos]
看起来并不合适。像[{:todos (om/get-query TodoList)}]
这样的东西会更好:-)
答案 1 :(得分:1)
如果您还没有请看Components, Identity & Normalization · omcljs/om Wiki · GitHub。本教程介绍如何在单个根目录下组织多组件应用程序 - 还应明确read
,mutate
,Ident
,IQuery
等的方式。由每个个人组件使用,以通过协调程序协调与 one-only-only 应用程序状态的交互。 app-state基本上是应用程序的数据库 - 在单个Map中使用嵌套数据结构。
React应用程序通常只有一个根组件 - 如果 多个根,它们通常按路由组织,即每个路由一个根(另请参阅Top-level React Components — Medium)。