使用om顯示隱藏的div（/ react）

Question

使用Om，我已經設置了一個組件，當用戶按下按鈕時，我想要顯示它。效果應該是從滑入div 。在Om項目中構建這個最好的方法是什麼？

我不能做喜歡的事，哈克：

(let [the-div (. js/document (.getElementById "the-div"))] 
    (.setAttribute dashboard "width" "500px")) 

因爲我覺得OM設置組件的影子DOM，我得到一個錯誤：Cannot read property 'style' of null。

任何人都可以指出我達到這個效果的正確方向嗎？程序結構或任何提示將不勝感激。

Answer 1

簡短的回答是指定組件中的寬度作爲狀態的函數，並更改狀態。

[:div {:style {:width (if big? "500px" "0px")}}] 

或者只是有條件地呈現它，或者使用類等

當涉及到動畫，使得它在幻燈片，事情有點棘手...... 可以使用CSSTransitionGroup Creating animations with Clojurescript Om

個人而言，我覺得太CSSTransitionGroups繁瑣，並且更喜歡一個更直接的聲明的方式 http://timothypratley.github.io/reanimated/#!/timothypratley.reanimated.examples 的基礎復活是奧妙非常簡單，並且可以爲om重新創建......它將每個渲染狀態更新爲目標目標，然後停止。