強制試劑組件更新窗口調整大小

Question

我試圖實現一個試劑組件，它跟蹤它的外部html元素的真實計算大小。以下作品：

(defn i-show-my-size [] 
    (let [size (r/atom nil)] 
    (r/create-class {:component-will-mount 
        (fn [this] 
         (set! (.-onresize js/window) 
          (r/force-update this))) 
        :reagent-render 
        (fn [] 
         [:div {:ref #(when % (reset! size (let [bb (.getBoundingClientRect %)] 
                  [(.-width bb) (.-height bb)])))} 
         (prn-str @size)])}))) 

有沒有更好的方法來做到這一點？例如。我是否需要創建級別的符號，或者可能沒有？

Answer 1

0.6.0介紹with-let（http://reagent-project.github.io/news/news060-alpha.html）他們的（下圖）的例子是非常相似，你的使用情況：

(defn mouse-pos-comp [] 
    (r/with-let [pointer (r/atom nil) 
       handler #(swap! pointer assoc 
           :x (.-pageX %) 
           :y (.-pageY %)) 
       _ (.addEventListener js/document "mousemove" handler)] 
    [:div 
    "Pointer moved to: " 
    (str @pointer)] 
    (finally 
     (.removeEventListener js/document "mousemove" handler))))