ウィンドウのサイズ変更時に試薬成分を強制的に更新する

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)])}))) 

もっと良い方法がありますか？例えば。クラスを作成する必要がありますか？ with-letを導入

Answer 1

0.6.0は（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))))