【问题标题】:Set initial state for missing key in component data设置组件数据中缺少键的初始状态
【发布时间】:2015-10-28 20:32:41
【问题描述】:

我正在尝试学习 ClojureScript 和 Om。有一个特定的案例让我在圈子里跑来跑去。

我有一个在没有键的情况下首次渲染的组件。

(defn model-view [data owner]
  (reify
    om/IWillMount
    (will-mount [_]
      (om/transact! data [:stats] (fn [] {}))
      (go
        (let [response ((<! (api/get-stats (data :id))) :body)
              stats (:stats response)]
          (om/update! data [:stats] stats))))
    om/IRender
    (render [_]
      (dom/div nil
               (dom/h3 nil (data :title))
               ;; Here I want to use the :stats key in data that I
               ;; queried for in IWillMount, but its not present
               ;; the first time this model is rendered. It's only present
               ;; AFTER IWillMount has ran.
               (om/build model-stats-view (data :stats)))))

第一次调用此组件时,:stats 键根本不存在于 data 中。这就是为什么我调用 API 来获取它的统计信息。但是 React 仍然调用了render 函数,因此组件崩溃了。

如何在此组件中设置初始状态,为data 提供一个名为:stats 的空映射,从而防止尝试在(om/build model-stats-view) 调用中呈现nil

【问题讨论】:

  • 你能用(get data :stats {})吗?
  • @cfrick 这行得通。谢谢。但我会留下来看看是否有一个更“类似 React”的解决方案 IInitState 或其他东西。

标签: clojure clojurescript om


【解决方案1】:

我更喜欢在初始化状态下进行所有初始化,然后在渲染状态下访问它。我在我的安装中放了一个循环。当您在 go-loop 中更新初始化状态(即:e-map)时,它会强制调用组件的渲染/重新渲染。我在所有组件中都使用它来进行组件间/组件内消息传递。只需将内容推送到 pub/sub 频道,我们就可以参加比赛了。

;To update my state I use a function:

(defn set-owner-state! [owner old-map-key old-map new-map]
   (om/set-state! owner {old-map-key (merge old-map new-map)}))

om/IInitState
(init-state [_]
  (println "queue->init-state")
  {:e-map {:active-fsm nil}})

om/IDidMount
(did-mount [_]
    (go-loop []
        (let [[v _] (alts! [server-fsm-events dispatcher-events])
              current-state (om/get-state owner)
              e-map (:e-map current-state)]
        ; what goes in here is the logic to respond to a message
        ; in my case I have a match, it could be a cond or a set of
        ; if's.
        (set-owner-state! owner :e-map e-map {:active-fsm :active :task-paths nil})
    ...

om/IRenderState
(render-state [_ {:keys [e-map]}]
  (println "e-map:" e-map)
  ...

【讨论】:

  • 你的文字解释很好,它让我弄清楚我做错了什么。但是您的代码示例太模糊了。我会接受你的回答,但我希望你的代码示例能真正向你展示modify :e-map here
猜你喜欢
  • 1970-01-01
  • 2023-01-10
  • 2021-07-07
  • 1970-01-01
  • 1970-01-01
  • 1970-01-01
  • 1970-01-01
  • 1970-01-01
  • 2021-02-01
相关资源
最近更新 更多