首页
学习
活动
专区
圈层
工具
发布
首页
学习
活动
专区
圈层
工具
MCP广场
社区首页 >问答首页 >在om.next中以零形式返回值的查询函数

在om.next中以零形式返回值的查询函数
EN

Stack Overflow用户
提问于 2016-01-07 02:40:21
回答 2查看 185关注 0票数 3

我目前正在努力学习om.next。

这是我的代码:

代码语言:javascript
运行
复制
(ns hlearn.core
  (:require [goog.dom :as gdom]
            [om.next :as om :refer-macros [defui]]
            [om.dom :as dom]
            [sablono.core :as html :refer-macros [html]]))

(enable-console-print!)

(def app-data
  (atom {:user ""
         :main-menu {:selected :home}}))

;; -------------------------------------------------------------------------
;; Parsing

(defmulti read om/dispatch)

(defmethod read :selected
  [{:keys [state]} _ _]
  {:value (get-in @state [:main-menu :selected])})

;; -------------------------------------------------------------------------
;; Components

(defui MainMenu
  static om/IQuery
  (query [this]
         [:selected])
  Object
  (render [this]
          (let [{:keys [selected]} (om/props this)]
            (println (= selected :home)))))

(def main-menu (om/factory MainMenu))

(defui RootView
  Object
  (render [this]
    (println "Render RootView")
    (main-menu)))

(def reconciler
  (om/reconciler
   {:state  app-data
    :parser (om/parser {:read read})}))

(om/add-root! reconciler
  RootView (gdom/getElement "app"))

我在这里的目标是,组件MainMenu必须在控制台上写入true (目前正在写入false)。

因为read函数应该返回{:value :home} (app状态上的值),因此(= selected :home)应该是真的。

实际上,MainMenu在控制台上写入false,因为selected具有nil值。

EN

回答 2

Stack Overflow用户

发布于 2016-01-07 16:04:06

事实证明,在RootView上呈现的(om/add-root!)组件必须为所有应用程序提供查询。

在这种情况下,RootView还必须提供一个查询,并将selected键传递给MainMenu组件。

代码语言:javascript
运行
复制
(def app-data
  (atom {:user ""
         :menu {:selected :home}}))

(defui RootView
  static om/IQuery
  (query [this]
    `[{:menu (om/get-query MainMenu)}])
  Object
  (render [this]
    (let [{:keys [menu]} (om/props this)]
      (println "Render RootView")
      (main-menu menu))))

另外,读取器函数在:menu键上调度,而不是:selected键。

代码语言:javascript
运行
复制
(defmethod read :menu
  [{:keys [state]} _ _]
  {:value (get-in @state [:menu])})

其余代码保持不变。

票数 2
EN

Stack Overflow用户

发布于 2016-01-21 04:39:17

om.next中,正如您所发现的,所有查询都必须组合到根组件。根组件根据read函数在处理根查询时返回的内容分配它的read

如果任何子组件都有查询,则应将该查询请求的支持作为子组件的工厂方法的第一个参数传递下来。这是你错过的第二件作品。

如果您在子组件中查询某个子组件中没有最终由其父组件传递的内容,则Om中目前没有任何警告或错误。因此,如果忘记传递道具,则最终会破坏子组件中键的nil值。

票数 1
EN
页面原文内容由Stack Overflow提供。腾讯云小微IT领域专用引擎提供翻译支持
原文链接:

https://stackoverflow.com/questions/34646528

复制
相关文章

相似问题

领券
问题归档专栏文章快讯文章归档关键词归档开发者手册归档开发者手册 Section 归档