-Reduxのに反応 -

Question

私のAPIは、フォームのノードのリストを返す不変の方法でこの状態変化を処理する方法：

[ 
    {id: '2', parentId: '1', name: 'baz' }, 
    {id: '3', parentId: '1', name: 'bar' }, 
    {id: '4', parentId: '5', name: 'foo' }, 
    ... 
] 

と私は、この情報を使用して、ツリー構造を表示します。

現在のところ、私の実装では、指定されたリストが状態として保存されています。私のレデューサーはまず既存の状態のクローンを作成し、ノードを追加/更新/削除します。

しかし、私の反応コンポーネントは、子供たちのリストが小道具（apiレスポンスの一部ではない）として渡されることを期待しています。したがって、私の最上位のコンポーネントでは、私は状態をとり、それを必要なフォームに変換し、代わりにコンポーネントを減らすことができます。自分の親のリストに保存されているそれぞれの子を持つツリーのハッシュマップのバージョンすなわち

{ 
    id: 0, name: 'root', 'children': [ 
     {id: '2', parentId: '1', name: 'baz', children: [{..., children: [...]}, {..., children: [...]}, ... }, 
    ...] 
} 

、その後、渡された最も外側のオブジェクトを、というツリーのルート：変換されたツリーは、フォームを持っていますダウン。

保存された状態はこの形式に変換されますが、ノードが大量になると、この状態が変更されるたびに遅延が発生しますので、この状態で直接状態を保存することを計画していますすなわちstate = root）、APIレスポンスを1回だけ再構成します。

不変の方法で状態の変更を行う方法はわかりませんが、私はノード階層の真下にある特定のノードに新しい子を追加したいと言っていますが、これを変更可能な方法で行うのは簡単です：子ノードを親ノードの子リストにプッシュするだけですが、どうしたらいいですか？

またはこれを行う別の方法は何ですか？

Answer 1

私はimmutablejsとtreeutils