Как мы можем встроить собственные объекты javascript в цикл данных Re-Frame?

Сначала давайте создадим приложение Re-Frame. Вам нужно будет установить Clojure и Leiningen (инструмент сборки), следуя этим инструкциям.

Чтобы создать приложение только с базовым шаблоном, используйте эту команду:

$ lein new re-frame example-app

Чтобы запустить наше приложение, мы можем использовать следующую команду:

$ lein watch auto

Теперь у нас есть собственное приложение Re-Frame, работающее на http://localhost:8020, иди и посмотри!

Чтобы ответить на этот вопрос, давайте сначала посмотрим, как мы можем взаимодействовать с Javascript из Clojurescript:

Давайте начнем с создания библиотеки Javascript, с которой мы можем поиграть. Вот базовая библиотека https://github.com/owodunni/exampleModule.

Он экспортирует некоторые функции, которые будут печататься в журнале. Это удобно, чтобы убедиться, что мы правильно взаимодействуем с Javascript.

Установите его в наше приложение Re-Frame, используя:

$ npm install git+https://github.com/owodunni/exampleModule.git

Мы можем попробовать использовать наш примерный модуль из events.cljs следующим образом:

(ns example-app.events
  (:require
   [re-frame.core :as re-frame]
   [example-app.db :as db]
   [examplemodule :as ex]
   ))
(re-frame/reg-event-db
 ::initialize-db
 (fn [_ _]
   (ex/logFunc "Hello from JS!")
   db/default-db))

Это напечатает небольшое приветствие в нашем журнале!

Как насчет добавления обратного вызова в функцию Javascript? Мы можем изменить наш код выше:

(re-frame/reg-event-db
 ::initialize-db
 (fn [_ _]
   (ex/logAndCallbackFunc
     "Hello from Javascript!"
     (fn [] (prn "Hello from Clojurescript!")))
   db/default-db))

Это даст нам два сообщения, одно из которых напечатано в Javascript, а другое — в Clojurescript.

Наконец, мы можем создать объект и вызвать его функцию. Перешел к db.cljs, там у нас есть наш default-db, давайте добавим к нему наш регистратор:

(ns example-app.db
  (:require
    [examplemodule :as ex]))
(def default-db
  {:name "re-frame"
   :logger (ex/Logger. "Almighty logger")})

Теперь мы можем использовать наш logger везде, где у нас есть доступ к нашему db, давайте использовать его в subs.cljs:

(ns example-app.subs
  (:require
   [re-frame.core :as re-frame]))
(re-frame/reg-sub
 ::name
 (fn [db]
   (.log (get db :logger) "calling from reg-sub")
   (:name db)))

Теперь нас будет ждать новое приветствие в консоли!

Вот и все! Я надеюсь, что это помогло кому-то освоить взаимодействие Javascript с Clojurescript.