Повторное использование компонентов

Может кто-нибудь, пожалуйста, помогите мне лучше понять компоненты, запросы и т. Д. Я борюсь с, казалось бы, тривиальной задачей, мне нужен один компонент с параметризованным запросом. Экземпляры этого компонента должны быть включены в родительский компонент, например, я хочу, чтобы списки разных видов фруктов были распределены по группе детей, и в каждой строке было бы указано имя ребенка и количество фруктов одного вида:

  (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

для 1-го экземпляра будет: {:kind :apples}

для 2-го экземпляра будет: {:kind :oranges}

это должно сделать 2 списка, похожих на это:

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

1 ответ

Решение

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

Есть :app/fruit-query-kinds в вашем БД (формат БД по умолчанию). Это будет список фруктов. У вас уже есть фруктовый компонент, но вам понадобится другой компонент, который имеет эту идею, чтобы быть списком видов фруктов для запросов. Дайте этому компоненту запрос и идентификатор. Неважно, будет ли оно отображаться или нет. Самое главное - правильно понять структуру данных. Его идентификатор будет просто что-то вроде: '[:fruit-query-kind/by-id 1100]и может состоять из '[:fruit/by-id 10] а также '[:fruit/by-id 20], Согласно вашему примеру 10 будет идентификатором для яблок и 20 для апельсинов. Это будет значение refs (вектор идентификаторов в хранилище БД по умолчанию) ключа :app/fruit-query-kinds, 1100 - это просто уникальный номер, который не изменится.

Важным является структура данных, в которой можно смоделировать все, даже параметры запроса.

Вам понадобятся мутации и некоторые кнопки (или другой ввод), которые вызывают transact! где-то, что напрямую меняет виды запросов фруктов в вашей БД. Если вам не нужен повторный рендеринг, звоните transact! с согласователем приложения, а не с компонентом.

Идея состоит в том, что вы можете иметь компонент (ы), которые запрашивают выбор, сделанный ранее пользователем. Таким образом, ваш первый компонент списка не будет знать, что это должно быть для яблок - все, что он знает, это то, что он должен отображать фрукты первого вида фруктовых запросов.

Я обнаружил, что вы можете делать столько перемещений между представлением и базой данных, сколько захотите, имея базу данных не только для хранения данных, но и текущего состояния представления. Пока что единственный раз, когда у меня возникли проблемы с этим, было, когда я по ошибке совершил not логического ключа в запросе компонента. Это, конечно, закончилось вечно мерцающим экраном.

На мой взгляд, способ работы с Om Next на клиенте заключается в том, чтобы все операции чтения выглядели одинаково при использовании всех db->tree, Как только вы примете этот подход, следующим шагом будет избавление от них всех вместе, что вы можете сделать, переключившись на Untangled framework.

Другие вопросы по тегам