代码不是从 go 块调用的,但它可以从 REPL 运行
Code not called from go block, but it works from REPL
我有更新 DOM 的代码。 new-recipe!
调用 API 来获取新的配方字符串。 update-recipe-state
接下来在屏幕中更新此状态。最后我们调用了 update-transition-buttons
.
(defn- add-listener-to-recipe-button! []
"Listens to go button, creates a new recipe and displays it"
(create-click-event-listener! (dommy/sel1 :#button-start)
#(go (new-recipe!)
(<! (timeout 2000))
(update-recipe-state!)
(<! (timeout 2000))
(update-transition-buttons! "onboarding"))))
;; define your app data so that it doesn't get over-written on reload
(defonce world
(add-listener-to-recipe-button!))
update-transition-buttons
在步骤之间有一些延迟(使用超时代码here)如下所示:
(defn- update-transition-buttons! [recipe-name]
"Updates the buttons with the transition names"
(go
;; Split response in list of actions by splitting on the comma
(let [response (<! (http/get (get-recipe-transitions-url recipe-name)))
transition-names (clojure.string/split (:body response) ",")]
(go (update-buttons! transition-names)
(<! (timeout 2000))
(js/console.log transition-names)
(set-button-event-handlers! transition-names)))))
因此它将响应拆分为一个字符串。 updates-buttons
通过添加一些按钮(这是可见的)更改页面上的状态。再次出现超时,然后我想 将事件处理程序添加到按钮 。这就是问题所在。
创建事件侦听器(也包含 console.log
)的例程如下所示:
(defn- listen-to-transition-button! [name]
"Creates click event listener on button (button HTML ID should be name)"
(do (js/console.log (str "Listening to " name))
(let [name-without-spaces (clojure.string/replace name " " "")
button (dommy/sel1 (keyword (str "#" name-without-spaces)))
action #(do (perform-action! name)
(update-recipe-state!))]
(create-click-event-listener! button action))))
(defn- set-button-event-handlers! [names]
"Creates click event listeners on the buttons (button ID should be name)"
(map listen-to-transition-button! names))
您再次看到一条 console.log
消息,它应该针对传递的每个元素发生。我在 Firefox 控制台中得到的输出是:
[FIRST SERVICE CALLED]
[NEXT SERVICE CALLED]
[DISPLAY LIST OF STEPS]: ["Step1", "Step2", "Step3"]
我期望的是:
[FIRST SERVICE CALLED]
[NEXT SERVICE CALLED]
[DISPLAY LIST OF STEPS]: ["Step1", "Step2", "Step3"]
Listening to Step1
Listening to Step2
Listening to Step3
因此由于某些原因没有添加事件处理程序(取决于之前步骤中生成的 HTML)并且没有显示 console.log
消息。
当我从 REPL 调用相同的代码时,我确实看到了输出,即:
repl=> (set-button-event-handlers! ["Step1","Step2", "Step3"])
(#object[Object [object Object]] #object[Object [object Object]] #object[Object [object Object]])
控制台输出为:
Listening to Step1
Listening to Step2
Listening to Step3
为什么 set-button-event-handlers!
可以从 REPL 调用,但不能在 update-buttons
之后的 update-transition-buttons
方法中调用?
看起来问题出在这里:
(map listen-to-transition-button! names)
在set-button-event-handlers!
它创建了一个惰性序列,元素只有在代码中的某处使用后才会被实现(这永远不会发生),但是当你在 repl 中调用它时,它会被完全实现以在输出中显示所有元素.尝试将此行更改为:
(doall (map listen-to-transition-button! names))
我有更新 DOM 的代码。 new-recipe!
调用 API 来获取新的配方字符串。 update-recipe-state
接下来在屏幕中更新此状态。最后我们调用了 update-transition-buttons
.
(defn- add-listener-to-recipe-button! []
"Listens to go button, creates a new recipe and displays it"
(create-click-event-listener! (dommy/sel1 :#button-start)
#(go (new-recipe!)
(<! (timeout 2000))
(update-recipe-state!)
(<! (timeout 2000))
(update-transition-buttons! "onboarding"))))
;; define your app data so that it doesn't get over-written on reload
(defonce world
(add-listener-to-recipe-button!))
update-transition-buttons
在步骤之间有一些延迟(使用超时代码here)如下所示:
(defn- update-transition-buttons! [recipe-name]
"Updates the buttons with the transition names"
(go
;; Split response in list of actions by splitting on the comma
(let [response (<! (http/get (get-recipe-transitions-url recipe-name)))
transition-names (clojure.string/split (:body response) ",")]
(go (update-buttons! transition-names)
(<! (timeout 2000))
(js/console.log transition-names)
(set-button-event-handlers! transition-names)))))
因此它将响应拆分为一个字符串。 updates-buttons
通过添加一些按钮(这是可见的)更改页面上的状态。再次出现超时,然后我想 将事件处理程序添加到按钮 。这就是问题所在。
创建事件侦听器(也包含 console.log
)的例程如下所示:
(defn- listen-to-transition-button! [name]
"Creates click event listener on button (button HTML ID should be name)"
(do (js/console.log (str "Listening to " name))
(let [name-without-spaces (clojure.string/replace name " " "")
button (dommy/sel1 (keyword (str "#" name-without-spaces)))
action #(do (perform-action! name)
(update-recipe-state!))]
(create-click-event-listener! button action))))
(defn- set-button-event-handlers! [names]
"Creates click event listeners on the buttons (button ID should be name)"
(map listen-to-transition-button! names))
您再次看到一条 console.log
消息,它应该针对传递的每个元素发生。我在 Firefox 控制台中得到的输出是:
[FIRST SERVICE CALLED]
[NEXT SERVICE CALLED]
[DISPLAY LIST OF STEPS]: ["Step1", "Step2", "Step3"]
我期望的是:
[FIRST SERVICE CALLED]
[NEXT SERVICE CALLED]
[DISPLAY LIST OF STEPS]: ["Step1", "Step2", "Step3"]
Listening to Step1
Listening to Step2
Listening to Step3
因此由于某些原因没有添加事件处理程序(取决于之前步骤中生成的 HTML)并且没有显示 console.log
消息。
当我从 REPL 调用相同的代码时,我确实看到了输出,即:
repl=> (set-button-event-handlers! ["Step1","Step2", "Step3"])
(#object[Object [object Object]] #object[Object [object Object]] #object[Object [object Object]])
控制台输出为:
Listening to Step1
Listening to Step2
Listening to Step3
为什么 set-button-event-handlers!
可以从 REPL 调用,但不能在 update-buttons
之后的 update-transition-buttons
方法中调用?
看起来问题出在这里:
(map listen-to-transition-button! names)
在set-button-event-handlers!
它创建了一个惰性序列,元素只有在代码中的某处使用后才会被实现(这永远不会发生),但是当你在 repl 中调用它时,它会被完全实现以在输出中显示所有元素.尝试将此行更改为:
(doall (map listen-to-transition-button! names))