圖像不會更新，換換

以下代碼在屏幕底部顯示5個不同的表情符號，並在上部中央顯示1個表情符號。我正在嘗試做到這一點，當點擊底部的表情符號時，頂部中間會出現相同的表情符號。我能夠通過以下方式更新包含表情符號歷史記錄的原子：點擊，但圖像不會更新當前網址。圖像不會更新，換換

(def emoji-history 
    (atom {:current "img/sad-tears.png"})) 

(defn Img40 [src reaction] 
[:img {:src src 
     :style {:width "60px" 
       :padding-right "20px"} 
     :on-click #(do 
        (js/console.log (get @emoji-history :current)) 
        (swap! emoji-history assoc :current src) 
        (js/console.log (get @emoji-history :current)))}]) 

(defn CurrentEmoji [] 
      [:img {:style {:width 40 :margin-top 15} 
       :src (get @emoji-history :current)}]) 

(defn EmojiDisplay [] 
    [:div {:style {:text-align "center"}} 
    [CurrentEmoji] 
    [:div {:style {:text-align "center" 
        :margin-top "200px" 
        :padding-left "20px"}} 
     [Img40 "img/smile.png" "happy"] 
     [Img40 "img/sad-tears.png" "sad"] 
     [Img40 "img/happy-tears.png" "amused"] 
     [Img40 "img/surprised.png" "surprised"] 
     [Img40 "img/angry.png" "angry"]]])

來源

2017-04-05 Jessie Richardson

你使用的是試劑嗎？應該不是/ r是一個'原子' - 爲什麼你會期望一個clojure原子的更新來觸發任何事情？ - 根據您提供的代碼。 – birdspider

因爲我正在通過以下方式更新圖像源：點擊。是的，使用試劑。儘管如此，並不是每個人都熟悉發生了什麼。 –

參考reagent.core命名空間和使用的試劑原子是這樣的：

(ns my-name.space.etc 
    (:require [reagent.core :as r])) 

(def emoji-history 
    (r/atom {:current "img/sad-tears.png"}))

的，你在這裏的代碼行...

(swap! emoji-history assoc :current src)

...你哪裏swap!你原子的值，這是正確的:-)

不像一個普通的老Clojure ato m，當Reagent原子的值（狀態）改變時，UI的重新呈現被觸發。

儘管如此，很少重新渲染整個UI。由於Reagent包裝了React，因此React系統可以解決DOM所需的最少的更改，所以它非常高效。

來源

2017-04-05 19:15:47 Scott

OMG非常感謝你。我不知道我忘記了需要試劑。：P –

圖像不會更新，換換

回答

相關問題