clojurescript页面定时刷新

场景

最近做蓝牙设备的连接，需要在app上实时显示蓝牙的读数，毕竟只有使用设备的时候才要求实时性，简易期间我们使用服务端通信，或者socket这种双向通信的，直接在页面时定时刷新

代码

(require '[reagent.core :as r])
(require '[re-frame.core :as rf])

(defn dispatch-timer-event
  []
  (let [now (js/Date.)]
    (rf/dispatch [:timer now])))

(defonce do-timer (js/setInterval dispatch-timer-event 1000))

(rf/reg-event-db                 
 :timer  
 (fn [db [_ new-time]]
   (prn "<<<<< this is a test log >>>>>" (str new-time))
   (assoc db :time new-time)))

停止

停止一个interval使用如下操作

(r/render-component (r/create-element "button"
                                      #js {:onClick #(. js/window (clearInterval do-timer))}
                                      "停止刷新"
                                      ) js/klipse-container)

划重点：定时任务启动后必须找到对应的才能停止掉，在实际开发的过程中，你也一定不希望单页面的应用，只要定时任务启动了，关闭了当前页定时任务还在执行着，一定是要找到某个合适的契机停止掉的。
我们是这样实现的，一个按钮控制跳页同时启动定时任务，setInterval的返回值用atom或者db保存起来。
页面退出，或者其他button有操作时，调用clearInterval将atom或者db里订阅的interval停止掉。

效果

实际使用中我们当然不是只打个log，是调用接口，效果如下：

image.png

参考

https://github.com/Day8/re-frame/blob/master/examples/simple/src/simple/core.cljs