Question

我正在尝试创建一个非常基本的基座应用程序来显示项目列表，或者如果列表为空则创建一条短信。

我认为我想要的是：

数据模型，其中[：root：items]将是我的项目列表
页面的模板函数（[：root]）
空列表的静态模板函数
包含元素
在应用程序开始时，发送一条消息，将列表初始化为空
在渲染中，回复：
- [node-create [] :map]做什么......什么都没有？
- [node-create [:root] :map]通过呈现整页的模板
- [node-create [:root :items] :map]添加空列表的模板

要清楚，我想在最后显示的内容是（没有元素）

<html>
 <div>My list</div>
 <p>There is nothing in the list</p>
</html>

当列表中有内容时：

<html>
 <div>My list</div>
 <ul>
   <li>item1</li>
   <li>item2</li>
 </ul>
</html>

我在这里走在正确的轨道上吗？

我坚持初始化数据模型是我想要的。我得到的最接近的是：

;; behavior.clj
(defn init-root-transform [old-value message]
  {})

(defn init-items-transform [old-value message]
  [])

(def example-app
  {:version 2
   ;; :transform [[:set-value [:greeting] set-value-transform]]})
   :transform [[:bootstrap [:root] init-app-transform]
               [:bootstrap-systems [:root :items] init-items-transform]
               ]})

;; start.cljs
... skipped...
    (app/begin app)
    (p/put-message (:input app) {msg/type :bootstrap msg/topic [:root]})
    (p/put-message (:input app) {msg/type :bootstrap-systems msg/topic [:root :items]})

问题在于，通过这种方式，我获得了一个包含值{：items []}的单个：根节点的数据模型。

这可能听起来像一个非常愚蠢的问题，但这两个数据模型是否相同？

[:root :systems] => []
[:root] => {:systems []}

当我启动应用程序时，生成的渲染增量为：

[node-create [] :map]
[node-create [:root] :map]
[value [:root] nil {:items [] }]

我认为这不适合渲染我的项目列表，是吗？

更新：

@solussd暗示两个数据模型是相同的;但是，当生成以下增量时：

[value [:root] nil {:items []}]

我仍然无法处理它。如果我添加这样的渲染配置：

[value [:root :items] render-items-list]

然后render-items-list函数不被调用。

如果我添加这样的渲染配置：

[value [:root] render-root]

然后将调用render-root函数，但很明显，不会使用正确的'path'，并且我认为当数据模型中对'：root'元素的任何其他更改时，也会调用它。改变。

任何想法如何解决这个问题都是受欢迎的......

Answer 1

是的，这两个数据模型是相同的。

node-create和value deltas足以将项目序列发送到渲染器，但是渲染粒度是整个项目列表。

您的渲染配置可能如下所示：

(defn render-config 
    []
    [:node-create [:root :items] render-item-list]
    [:value [:root :items] update-item-list])

如果您想为列表中的每个项目使用模板，例如

<ul template="list-item" fields="id:id,content:item"/>

在html模板文件中），您可能希望在单个列表项级别输出增量，并且可能将它们作为地图中的关键字，例如像这样的模型：

{:root {:items {:1 <item> :2 <item> ...}}}。

希望这有帮助。

Answer 2

我现在没有计算机来检查这一点，但我认为如果您在数据流定义中添加emit对，那么它将允许您触发渲染器：

{... :emit [[#{:root :items}] (app/default-emitter :main)]}

这基本上告诉数据流将[:root :items]的更改发布为路径[:main :root :items]下的单独呈现增量。在渲染配置中，您应该指定此路径：

[... [:value [:main :root :items] render-items] ...]

您需要以类似的方式添加渲染路径[:main]，即

[... [:node-create [:main] render-root] ...]

当渲染增量开始到达渲染器时，这将触发主模板。

希望这有帮助。

基座：您可以使用什么数据流来呈现新初始化的空列表？

2 个答案: