0
  • 嗯“0.8.0”

我最近开始通过使用om 存储库的示例代码来学习om 。现在，我正在检查多个示例，并且可以理解该程序的行为。

在我点击“+”按钮后，

  • 首先，打印“偶数（或奇数）小部件卸载”。
  • 接下来，打印“奇数（或偶数）小部件安装”。

但是当我添加以下代码时
（只需将奇偶小部件defmulti代码更改为defn代码）

(defn test-widget
  [props owner]
  (reify
    om/IWillMount
    (will-mount [_]
      (println "Test widget mounting"))
    om/IWillUnmount
    (will-unmount [_]
      (println "Test widget unmounting"))
    om/IRender
    (render [_]
      (dom/div nil
        (dom/h2 nil (str "Test Widget: " (:my-number props)))
        (dom/p nil (:text props))
        (dom/button
          #js {:onClick #(om/transact! props :my-number inc)}
          "+")))))

并尝试使用此功能而不是test-widget，结果，没有打印消息...

那么在这种情况下，defmulti 和 defn 有什么区别呢？这是错误还是正确的行为？

提前致谢。

4

1 回答 1

2

协议方法om/IWillMount和om/IWillUnmount仅在组件安装/卸载时调用一次。它不会在每次渲染时调用，因此如果单击“+”按钮不会导致组件被挂载/卸载，则不会生成日志消息。使用多方法对此行为没有影响。

使用多方法版本时您会看到重复的日志语句的原因是每次单击都会返回不同的组件，因此每次单击“+”时也会安装/卸载组件，而使用普通函数时，单个组件是每次单击“+”时已安装并保持已安装状态。

对于普通函数和多方法版本，您生成的日志消息将出现在浏览器的开发人员控制台中，但仅在组件挂载/卸载时出现，而不是在每次渲染时出现。

单击“+”按钮将在普通函数场景中触发现有已安装组件的重新渲染。如果要登录组件的每个渲染，则需要执行以下操作： 

(defn test-widget
  [props owner]
  (reify
    om/IWillMount
    (will-mount [_]
      (println "Test widget mounting"))
    om/IWillUnmount
    (will-unmount [_]
      (println "Test widget unmounting"))
    om/IRender
    (render [_]
      (.log js/console "Rendering test widget!")
      (dom/div nil
               (dom/h2 nil (str "Test Widget: " (:my-number props)))
               (dom/p nil (:text props))
               (dom/button
                #js {:onClick #(om/transact! props :my-number inc)}
                "+")))))

(defn app [props owner]
  (reify
    om/IRender
    (render [_]
      (apply dom/div nil
        (om/build-all test-widget (:widgets props))))))
于 2015-01-20T13:55:41.817 回答