1

我想做一些类似于 Reagent form-3 组件的事情，这使我能够定义一些共享（静态）变量以在生命周期函数中使用。

基本上我的问题是如何构造与let下面的试剂代码片段中的等效的东西？我似乎无法弄清楚如何使用 Om 的defui宏正确执行此操作。

一个简单的例子是生成一个内部 id，我可以在我的组件的特定实例的所有生命周期函数中通过gdom/getElement.

(defn my-component
  [x y z]  
  (let [id (gensym "my-component-")]  ;; <-- how to do this in Om?
     (reagent/create-class                 
       {:component-did-mount (...)
        :component-will-mount (...)          
        :reagent-render
         (fn [x y z] (js/console.log id)))) ;; <-- id is available
4

2 回答 2

1

您可以使用om.next/set-state!,om.next/update-state!和om.next/get-state来写入、更改和读取组件本地状态。

然而，组件本地状态是应用程序状态的可怜表亲。要使用应用程序状态，请给您的defui组件一个标识，并简单地组成一个关键字，该关键字是组件查询的一部分。然后设置 read 和 mutate 在您发明的关键字上调度的多方法。

附带说明 - 如果您使用的是 Fulcro 而不是 Om Next，则不需要 read 多方法。

于 2017-11-08T14:21:40.157 回答
0

经过一段时间的挖掘，我发现解决方案是结合使用 react 的initLocalState生命周期方法和om.next/get-stateChris 的回答所暗示的那样。

大体的轮廓变成如下：

(defui MyComponent
    Object
    (initLocalState [this] {:id (gensym "") ...}) ; <-- the key
    (render [this]
     (let [id (om/get-state this :id)] ...))
    (componentDidmount [this]
     (let [id (om/get-state this :id)] ...))
    ...

这种方法比 Reagent 中的方法更冗长，但我对此很满意，因为它提供了等效的功能。我一直都在使用它，所以有点惊讶我在其他地方找不到任何关于这个的讨论。

于 2017-11-09T07:25:23.840 回答