0

backbone.jsの使用:

いくつかの属性を含むModelAのコレクションと、いくつかのModelBを保持する1つの「ノード」があります。ModelBには、いくつかの属性も含まれています。

CollectionA

 ModelA
  Attribute 1
  .
  .
  Attribute n
  "Node"
     ModelB
       Attribute 1
       Attribute 2
     ModelB
       Attribute 1
       Attribute 2

 ModelA
  Attribute 1
  .
  .
  Attribute n
  "Node"
     ModelB
       Attribute 1
       Attribute 2
     ModelB
       Attribute 1
       Attribute 2

私はまだビューに取り組んでいますが、主なアイデアは、ビューを同様の方法で構造化する必要があるということです。(コレクションビューは、いくつかのビューBを保持するいくつかのビューAを保持します)。同じModelBが複数のViewB間で共有されることはありません。

Q1:デザインは理にかなっていますか、それとも私が考慮すべき明らかな欠陥はありますか?(これはBackboneJsでの私の最初の試みです)。

Q2:「ノード」を設定する最良の方法は何ですか?現在、ModelBの配列を使用しています。代わりに、各ModelAにModelBのコレクションを含めることは可能ですか?どちらのアプローチが良いですか?

どんなガイドラインも適用されます!

また、関連する問題に関するこの優れた投稿を読んだことも指摘したいと思います(推奨)。ただし、この場合と同じように、配列/コレクションにModelBが含まれていませんでした。

4

1 に答える 1

2

Q1:デザインは理にかなっていますか、それとも私が考慮すべき明らかな欠陥はありますか?設計上の前提:コレクションAには多くのモデルAがあり、モデルAにはモデルBのコレクションがあり、各モデルBには独自のビューBがあります。

Q2:各ModelAにModelBのコレクションを含めることは可能ですか?

回答:実行可能です。

モデルの「中に」関連するサブモデルがたくさんあることはかなり一般的です。配列、オブジェクト、それらのモデルBを保持するコレクション(コンテナと呼びましょう)を作成することで、間違いなくそれを実行できます(コンテナと呼びましょう)。基本的な方法は、コンテナを作成してから、新しいモデルをインスタンス化して、それらを接続します。後でその状態に戻ることができるように、これらのモデルBで関連する親モデルAへの何らかの参照が必要になる可能性があります。各モデルBと同様に、属性としてModelA_IDがあります。

これは、PaulUitholのBackbone-Relationalの良い使い方かもしれません。

Backbone-Relationalを使用すると、モデル(クラス)をセットアップし、モデルBのコレクションを持つように定義できます。コードは次のようになります。

ModelA = Backbone.RelationalModel.extend({
    relations: [{
        type: Backbone.HasMany,
        key: 'modelBs',
        relatedModel: 'ModelB',
        collectionType: 'ModelBCollection',
        reverseRelation: {
            key: 'parentA'
        }
    }],
    defaults: ...,
    initialize: ...,
    etc. ... // Other instance properties and functions of model.
});

これを行うと、インスタンス化するすべてのモデルAに、ModelA属性を介して参照できるモデルBのコレクションが含まれますmodelBs。または、指定した任意のキー。

ModelAをインスタンス化すると次のようになります。

myModelA = new ModelA({
    // Setting up ModelA attributes...
    'modelBs': [1, 3, 7]
});

ModelAをインスタンス化し、定義した他の属性を設定するとともに、ModelAの属性modelBの値も設定します。これは、ModelAに関連する各ModelBのIDの配列です。これは、コレクションがどのModelBがこのModelAに関連付けられているかを知る方法です。

myModelA.fetchRelated('modelBs');

呼び出しは、 modelBs.fetchRelated()コレクションにModelB 1、3、および7を取り込む要求をサーバーに送信します。

ModelAのModelBのコレクションにアクセスする場合は、次のようにします。

myModelA.get('modelBs');

これにより、関連するモデルをフェッチし、コレクションにModelBが含まれていると仮定して、そのModelAに関連するModelBのコレクションが返されます。

Backbone-Relationalの良いところは、親モデルのインスタンス化時に、これらの定義された関係を自動的に確立するのが簡単になることです。また、逆の関係が作成されるため、親から子へ、子から親へと簡単に上下に移動できます。

ModelBを操作していて、ModelAにアクセスしたい場合は、確立したreverseRelationキーを使用しますparentA

someModelB.get('parentA');    // Points to the related ModelA

また、モデル内のモデルにモデルがある場合に発生するバインディングやその他の問題にも役立ちます。リレーショナルは、1対1、1対多、および逆の関係でうまく機能します。多対多の回避策がありますが、設定方法が難しい提案であるため、一般的ではないと思います。

ビューに関しては、あなたが何を考えているのか正確にはわかりませんが、ビューの「コレクション」が必要ですか?

ModelBのコレクションを持つModelAがあるとしましょう。各ModelBには、関連付けられたビューがあります。これは、昔ながらのLISTの概念で非常にうまく説明されています。

<div id="ModelAView">
    <ul>
        <li>ModelB_1</li>
        <li>ModelB_3</li>
        <li>ModelB_7</li>
    </ul>
</div>

ModelBはたくさんありますが、コレクションにはすでにそれらがすっきりと整理されています。ビューを管理するデータ駆動型の方法を使用する場合は、ビューオブジェクトを別のリストに配置する必要はありません。代わりに、それらを自己管理させることができます!

// Assume when you instantiate ViewB, you pass to it a ModelB.

ViewB = Backbone.View.extend({
    initialize: function() {
        this.model.bind('remove', this.remove, this);
        this.model.bind('update:colorAttr', this.updateColor, this);
    },
    updateColor: function() {
        this.$el.css('color', this.model.colorAttr);
    }
});

ここで、コレクションからModelBを削除するとします。

myModelA.get('modelBs').remove(someModelB);

次に、このmodelBに関連付けられたビューがビューから自動的に削除されます。

これがあなたが考えていたものであるかどうかはわかりません。私は通常、このアプローチを採用しています。とにかく、もっと詳細がある場合は、コメントにそれらを投稿してください。お役に立てれば。

于 2012-06-05T12:41:43.387 に答える