Пьедестал: какой поток данных вы можете использовать для отображения нового инициализированного пустого списка?

Я пытаюсь сделать очень простое приложение на пьедестале, чтобы отобразить список элементов или текстовое сообщение, если список пуст.

Я думал, что я хотел:

  • модель данных, где [: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 Функция будет вызываться, но, очевидно, не с правильным "путем", и я предполагаю, что она также будет вызываться при изменении любого другого изменения элемента ": root" в модели данных.

Любая идея, как я могу это исправить, приветствуется...

Источник

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] ...]

Это вызовет ваш основной шаблон, когда ваши рендеринг-дельты начнут поступать в рендерер.

Надеюсь, это поможет.

Источник

Да, эти две модели данных одинаковы.

Различия между созданием узла и значением достаточны для отправки последовательности элементов вашему средству визуализации, но гранулярность рендеринга - это весь список элементов.

Ваша конфигурация рендеринга может выглядеть так:

(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> ...}}},

Надеюсь это поможет.

Источник
Другие вопросы по тегам