4

私はBackboneに比較的慣れていません.しばらく検索しましたが、私の質問を満たす答えが見つかりませんでした.

tl;dr:コレクションのサブセット (ページング/フィルタリングのようなサブセットではなく、コレクションのモデルのフィールドの一部のみのように) を表す方法は? (たとえば、詳細にフィールドだけでなく、ネストされた子コレクションも含まれている場合に、何かの名前と変更日のみを表示するリスト ビュー)

詳細版では、アプリケーションの構造は次のとおりです。

モデル

  • DocumentCollection- ドキュメントのコレクション。名前と最終更新日のみを取得する必要があります
    • Document- コレクション フェッチの一部としてフェッチされた場合は、名前のみをフェッチし、変更日のみをフェッチする必要があります。「スタンドアロン」(詳細ビューなど) でフェッチされた場合は、説明と子記事もフェッチする必要があります。
      • ArticleColletionドキュメントの一部であるネストされたコレクションは、ドキュメントが詳細ビューでフェッチされるときにのみフェッチする必要がありますが、「レイジー」であり、フェッチされたときにフェッチされないようにする必要がDocumentCollectionあります
        • Article

ビュー

  • DocumentCollectionView(ドキュメント名と最終更新日のみ表示)
  • DocumentView(ドキュメント名、説明、記事を含む)
  • ArticlesViewArticleView単一の記事または記事のコレクションを表示するため

ゴール

DocumentCollection fetchモデルのサブセットDocument(名前と変更時間のみ) のみを取得するメソッド呼び出しを行い、Document直接取得する場合は、説明フィールドと子記事も取得するようにしたいと考えています。

現実世界のモデルは、より多くのフィールドを使用してもう少し複雑になるため、回線上のトラフィックを削減し、必要になる前にフィールドやサブコレクションをロードしないようにする必要があります。

可能な解決策

  1. fetch メソッドをオーバーライドし、関連するロジックを適用します (「完全」または「部分的」ロードのフラグなど)。

  2. 怠惰なフィールドを忘れて、ネストされたコレクションだけを怠惰にし、未使用のフィールドをカットするのは時期尚早で不要な最適化であり、ビューのレンダリングの一部として必要なものとそうでないものを決定するのはモデルの責任ではありません。すべてをもたらす必要があります

  3. 「概要」ビュー用に別のコレクションとモデルを用意します。たとえばDocumentSummaryCollection、DocumentCollection を拡張しDocumentSummaryCollectionますか?

質問

上記の（もしあれば）それを行う「バックボーン」の方法は何ですか？他のアプローチはありますか？

4

2 に答える 2

8

これは、処理する「バックボーン」の方法があるかどうかよくわからない一般的なシナリオの 1 つです。ここに1つの可能な解決策があります...

ドキュメント コレクション ( ) をフェッチすると、次の/api/documentsような json が返されます。

[{id: 1, name: 'foo'}, {id: 2, name: 'bar'}]

ドキュメント ( ) を取得すると、次の/api/documents/1ような json が返されます。

{
    id: 1, name: 'foo', description: 'some stuff about foo', 
    articles: [{id: 1, name: 'hello'}, {id: 2, name: 'hi again'}]
}

個々の DocumentModel がフェッチされると、新しい属性がありますarticles。change:articlesイベントをリッスンし、ArticlesCollection が含まsetれる新しい json をリッスンします。this.articles

今...いくつかのコード：

var Article = Backbone.Model.extend({});

var ArticleCollection = Backbone.Collection.extend({
    model: Article
});

var Document = Backbone.Model.extend({
    constructor: function() {
        // make sure articles collection is created.
        this.articles = new ArticleCollection();
        Backbone.Model.prototype.constructor.apply(this, arguments);
    },
    initialize: function(attributes, options) {
        this.articlesChanged();
        this.on('change:articles', this.articlesChanged, this);
    },

    // articles attribute changed.
    // set it into the Collection.
    // this way, existing models will be updated, new ones added.
    articlesChanged: function(){
        // if document was fetched and has articles json array,
        // set that json into this.articles collection.
        var articles = this.get('articles');
        if(articles){
            this.articles.set(articles);
            // remove 'articles' attribute now that it is set into the collection.
            this.unset('articles');
        }
    }
});

var DocumentCollection = Backbone.Collection.extend({
    model: Document
});

いくつかのコード：

var docs = new DocumentCollection();
docs.fetch().done(function() {
    // docs now has documents with only name, date attributes, 
    // and empty articles collection.
    var doc = docs.at(0);
    var name = doc.get('name'); // foo
    var articleCount = doc.articles.length; // 0

    doc.fetch().done(function() {
        // first doc is now full, with articles, description, etc.
        doc.articles.each(function(article) { 
            console.log(article.get('name'));
        }, this);

        // re-fetch the collection later... to check if new documents exist.
        docs.fetch().done(function() {
            // new docs added, removed docs gone.
            // existing doc models updated.
        });
    });
});

これについて私が気に入っている主な点は、ドキュメント コレクションまたは個々のドキュメントが後で再取得された場合でも、ドキュメント/記事コレクションのインスタンスが保持されることです。

したがって、たとえば、DocumentModel とその記事コレクションを詳細ビューに表示していて、DocumentCollection 全体が再フェッチされた場合、表示されている DocumentModel はフェッチ後もコレクションに残ります (実際に削除されない限り)。サーバ）。change add removeこれらのインスタンスにいくつかの型イベントが接続されている場合、これは便利です。

Backbone 1.0 が 'update' fetch に移行したことで (これは素晴らしいことです)、他に (またはより良い) 解決策があるかどうか知りたいです。この正確なソリューションを多く使用しましたが、それが理想的かどうかはわかりません。parse以前は子jsonと子コレクションを取得するためにもっと使用していresetました..しかし、フェッチの更新でいくつかの問題に遭遇したと思うので、これを試し始めました。

于 2013-04-05T02:02:10.017 に答える