0

我在使用 Om.next 中的输入字段中的数据更新状态时遇到问题。

在 Om.next 中读取状态是通过查询来解决的,查询使组件能够实现独立于上下文的获取状态,这很棒,因为这意味着组件不需要知道状态原子的结构,它只需要了解与它直接相关的状态原子的本地片段。

不幸的是,我无法确定在相反方向上执行此操作的方法,即基于用户与组件的交互以不将其与状态原子中组件的位置耦合的方式改变状态。

网络上的大多数示例都有 mutate 函数,它们从根开始修改状态原子中的特定路径。

(defonce app-state (atom {:badge {:credentials {:user "" :password ""}}}))

所以现在我去渲染组件:

Object
(render [this]
(dom/div nil
       (dom/input #js {:onChange ???
                       :value {:user value}})
       (dom/input #js {:onChange ????
                       :value {:password value}})))

这是一个相当粗略的例子,但是当用户键入时如何更新状态,而不耦合到它存储在 path 下的事实[:badge :credentials]

读取由查询限定,但突变不是。这是一个简单的人为示例,但是当我尝试渲染和更新具有(在编码时)未知形状的嵌套树时,情况会变得更糟。

4

1 回答 1

0

:onChange可以调用您的一种突变:

:onChange (fn [_] (om/transact! this `[(app/set-name { :person 1 :name ~n })]))

除了参数和调用突变的位置之外,没有耦合——突变只不过是一个名字——在这里app/set-name。当然,必须实施突变。这里是:

(defmethod m/mutate 'app/set-name
  [{:keys [state] :as env} key {:keys [person name] :as params}]
  {:action (fn []
    (swap! state update-in [:people/by-id person] assoc :person/name name))})

突变代码本身将处理标准化的应用程序状态,这意味着数据的结构形状不是树。

此示例取自:http://localhost:3449/#!/untangled_devguide.G_Mutation

于 2016-11-27T23:26:41.987 回答