Mobxのディープオブジェクトを見る

Question

ディープjsonオブジェクト構造（ツリーなど）で@ observableを実装する方法を探しています。データツリーが本当に深刻になる可能性があります。各ノードには多くのプロパティがありますが、ツリーノードでは1つのプロパティしか観察する必要がありません。単にすれば

@observable questionnaire = {} 

でも動作しますが、それはウエストだと思います。私は「選択された」特性のみを観察する必要がある。 ここにjson構造があります。私がここで間違っている場合は、アンケートの対象を簡略化しています。 new Node(json)：

class Node { 
    @observable selected = false; 
    @observable childNodes = asFlat([]); 

    constructor(data) { 
    // Recursively create `Node` objects for all children. 
    data.childNodes = data.childNodes.map(child => new Node(child)); 
    Object.assign(this, data); 
    } 
} 

は、その後、あなたのトップレベルのJSONオブジェクトから Nodeオブジェクトを作成します。

[ 
    { 
    "id": "1", 
    "title": "level 1", 
    "description": "text", 
    "type": "Question", 
    "selected": false, 
    "childNodes": [ 
     { 
     "title": "level 2", 
     "description": "text", 
     "type": "Question", 
     "selected": false, 
     "childNodes": [ 
      { 
      "title": "level 3", 
      "description": null, 
      "type": "Question", 
      "selected": false, 
      "childNodes": [ 
       { 
       "title": "level 4 1", 
       "childNodes": [], 
       "description": null, 
       "type": "Checkbox", 
       "selected": false 
       }, 
       { 
       "title": "level 4 2", 
       "childNodes": [], 
       "description": null, 
       "type": "Checkbox", 
       "selected": false 
       }, 
       { 
       "title": "level 4 3", 
       "childNodes": [], 
       "description": null, 
       "type": "Checkbox", 
       "selected": false 
       }, 
       ... 
      ] 
      }, ... 

Answer 1

一つの方法は、次のようにNodeクラスを実装することです。

この解決策は、selectedとchildNodesしか観察しません。あなたのオブジェクトをNodeオブジェクトにラップする必要があるので、理想的ではありません。しかし、私はそれを行う他の方法を考えることはできません。