Om.Nextライフサイクル関数内のローカル状態を閉じる

Question

ライフサイクル関数で使用するいくつかの共有（静的）変数を定義できるReagentフォーム-3コンポーネントと同様のことをしたいと思います。

基本的に私の質問は、letに相当するものを以下の試薬コードスニペットでどのように構築するのですか？私はOmのdefuiマクロを使ってこれを正しく行う方法を理解できないようです。

単純な例は、gdom/getElementでコンポーネントの特定のインスタンスのすべてのライフサイクル機能にアクセスできる内部IDを生成することです。

(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 

Answer 1

掘り起こした後、私は解決策が反応のinitLocalStateライフサイクルメソッドとom.next/get-stateを使用してChrisの答えにヒントを得たことを発見しました。

次のように一般的な概要は次のようになります。

(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)] ...)) 
    ... 

それは同等の機能を提供して、このアプローチは、試薬よりも冗長ですが、私はそれで大丈夫ですよ。私はこれをいつも使っているので、少し驚いて私は他の場所でこれに関する議論を見つけることができませんでした。

Answer 2

あなたは、に書き込みを変更し、コンポーネントのローカル状態から読み取るom.next/set-state!、om.next/update-state!とom.next/get-stateを使用することができます。

しかし、コンポーネントのローカル状態は、いとこの状態からアプリ状態への悪い状態です。アプリ状態を使用するには、defuiコンポーネントにidentを与え、単にコンポーネントのクエリの一部であるキーワードを作成します。それから、あなたが発明したキーワードにディスパッチするマルチメソッドを読み込み、変更します。

注 - Om NextではなくFulcroを使用している場合は、読み取りマルチメソッドは必要ありません。