Как мы можем встроить собственные объекты javascript в цикл данных Re-Frame?
Сначала давайте создадим приложение Re-Frame. Вам нужно будет установить Clojure и Leiningen (инструмент сборки), следуя этим инструкциям.
Чтобы создать приложение только с базовым шаблоном, используйте эту команду:
$ lein new re-frame example-app
Чтобы запустить наше приложение, мы можем использовать следующую команду:
$ lein watch auto
Теперь у нас есть собственное приложение Re-Frame, работающее на http://localhost:8020, иди и посмотри!
Чтобы ответить на этот вопрос, давайте сначала посмотрим, как мы можем взаимодействовать с Javascript из Clojurescript:
- https://lwhorton.github.io/2018/10/20/clojurescript-interop-with-javascript.html#property-access
- https://cljs.github.io/api/cljs.core/js-obj
- https://www.spacjer.com/blog/2014/09/12/clojurescript-javascript-interop/
Давайте начнем с создания библиотеки 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.