1

私はExtJS4.1.1でTreePanel/TreeStoreを使用しており、autoSyncが有効になっていて、Ajaxプロキシを介してサーバーエンドポイントへのAPI呼び出しが定義されています。

特定のプロパティを設定してノードを作成すると、create APIエンドポイントへのautoSync呼び出し中に、サーバーに2つの子ノードが自動的に追加されます。サーバーの応答テキストは次のようになります。

{
  "success" : true,
  "errorMsg" : null,
  "children" : {
    "id" : "toolbox-42",
    "parentId" : null,
    "itemName" : "My Toolbox",
    "nodeType" : "toolbox",
    "children" : [{
        "id" : "tool-91",
        "parentId" : "toolbox-42",
        "itemName" : "Default Tool 1",
        "nodeType" : "tool",
        "leaf" : true,
      }, {
        "id" : "tool-92",
        "parentId" : "toolbox-42",
        "itemName" : "Default Tool 2",
        "nodeType" : "tool",
        "leaf" : true
      }
    ]
  }
}

ルートレベルのキーを使用してノードのプロパティを設定すると、"children"問題なく機能します。プロパティは、"id"挿入されたノードに適切に設定されます。

私の問題は、サーバーが追加した子ノードがツリーに表示されないことです。これらをツリービューに追加するにはどうすればよいですか？

これが私が検討したいくつかの解決策です：

  • サーバーの応答で、ルートレベルの"children"オブジェクトを配列にし、新しいノードを配列の最後に追加します（親ノードの下にネストするのではありません）。Ext.data.reader.Reader（ソースはこちら）のextractDataメソッドは、返されたすべてのレコードが抽出されることを示します。ただし、 Ext.data.Operation（ここ）のcommitRecordsメソッドは、リクエストに含まれるclientRecordsの数のみを更新します。これには、サーバーの応答に新しいレコードが含まれていないことは明らかです。
  • "children"サーバーの応答後、サーバーの応答のノードを使用して、クライアント側のツリーストアにレコードを手動で追加します。ただし、これらのレコードを「同期済み」としてマークする簡単な方法はないようです。
  • サーバーにレコードを追加しないでください。代わりに、同期操作が行われる前に、それらをクライアントに手動で追加します（したがって、同期操作により、サーバーに3つの挿入が行われます）。ただし、サーバーはまだ親ノードを追加しておらず、応答としてIDを返しているため、作成リクエストの子ノードにはparentIdが設定されていません。
  • サーバーが親ノードを追加した後に一度起動するイベントハンドラーをアタッチし、次にクライアントにプログラムで子ノードを追加します（サーバーに自動同期されます）。ただし、これには2つのサーバーラウンドトリップが必要になります。また、私が知っている唯一の候補イベントは'write'Ext.data.TreeStoreにあり'failwrite'、書き込み操作が失敗した場合にリスナーを削除するために使用できる対応するイベントはありません。それを提供するために抽象化レイヤーを追加することもできます...しかし、Senchaがすでにより良い方法を構築しているのであれば、私はむしろそうしません。

他に何か提案はありますか？私は、うまくいく提案、またはSenchaがこの問題に対処することをどのように推奨するかを説明するステートメント/リンクを受け入れます。

ありがとう。

更新：私のストア、プロキシ、およびリーダーは次のように構成されています。

  var store = Ext.create('Ext.data.TreeStore', {
    model :    'App.models.Task',
    autoLoad : true,
    autoSync : true,
    proxy : {
      type : 'ajax',
      api : {
        create :  appUrl + 'Data/InsertTreeData',
        read :    appUrl + 'Data/GetTreeData',
        update :  appUrl + 'Data/UpdateTreeData',
        destroy : appUrl + 'Data/DeleteTreeData'
      },
      reader : {
        type : 'json',
        messageProperty : 'errorMsg'
      }
    }
  });
4

1 に答える 1

2

サーバー側のツリーにノードを追加するときに行うことは、親オブジェクトID（ルートである可能性があり、それで問題ありません）を取得してから、次のようなrefreshParentルーチンを実行することです。

var node = this.store.getNodeById(id);
if (node){
        this.store.load({node:node});
}

ここでのコンテキストはツリーパネルです。このルーチンは、ツリーの特定のブランチをリロードします。

于 2013-02-22T00:44:21.523 に答える