8

我正在玩这个re-frame框架。

在下面的代码中，当用户输入内容时，我无法更新输入值：

(defn measurement-input [{:keys [amount unit path]}]
  (let [amt (atom amount)]
    (fn []
      [:div
       [:input {:type "text"
                :value @amt
                :on-change #(reset! amt (-> % .-target .-value))}]
       [:input {:type "button"
                :value unit}]])))

:value在我更改为之前，输入值不会更改:defaultValue。我很确定上面的例子与Reagent输入的例子很相似。

在下面的代码中，当用户更新输入值时，我尝试做两件事。我正在尝试reset!输入的值以及dispatch事件处理程序的值。我已经将这两个函数调用都包含在一个do调用中。

另外值得注意的是，在下面的代码中，用户可以更新文本字段中的值。

(defn measurement-input [{:keys [amount unit path]}]
  (let [amt (atom amount)]
    (fn []
      [:div
       [:input {:type "text"
                :value @amt
                :on-change (do #(reset! amt (-> % .-target .-value))
                                (re-frame/dispatch [:update-value @amt]))}]
       [:input {:type "button"
                :value unit}]])))

在 javascript 控制台中，我收到以下错误：

Uncaught TypeError: Cannot read property 'call' of null  template.cljs?rel=1435381284083:101

感谢大家的任何帮助！

4

1 回答 1

6

在 ClojureScript Google Groups 的 Daniel Kersten 向我解释了为什么代码片段不起作用。帖子的链接在这里。

第一个代码片段

reagent用它自己的实现覆盖clojure的原子。re-frame'sviews.cljs默认情况下不引用此内容。一旦你提到reagent的版本atom，一切都会奏效。

在views.cljs文件的顶部，更改：

(ns performance-tracker.views
    (:require [re-frame.core :refer [subscribe dispatch]]))

至：

(ns performance-tracker.views
    (:require [reagent.core  :as reagent :refer [atom]]
              [re-frame.core :refer [subscribe dispatch]]))

第二段代码

:on-change期望一个函数。我在一个do街区经过。只需将块包装在do函数中即可修复错误。请参阅下面的正确代码：

(defn measurement-input [{:keys [amount unit path]}]
  (let [amt (atom amount)]
    (fn []
      [:div
       [:input {:type "text"
                :value @amt
                :on-change #(do (reset! amt (-> % .-target .-value)) ;; argument literal, %, is the event passed in the function callback
                            (re-frame/dispatch [:update-value @amt [:measurements path :amount]]))}]
       [:input {:type "button"
                :value unit}]])))
于 2015-06-30T16:50:00.280 回答