1

無限スクロールのページがあります。ページは最初に 3 つのタグで読み込まれます。各セクションには、データベースから取得した 3 つの製品画像 (画像だけでなく、製品情報も) が含まれています。アンダースコア テンプレートは次のようになります。

<section>
  <div class='left'>
    <img src="{{ product.src }}" />
  </div>
  <div class='right'>
    <div class='top'>
      <img src="{{ product.src }}" />
    </div>
    <div class='bottom'>
      <img src="{{ product.src }}" />
    </div>
  </div>
</section>

これをレンダリングする方法を考えるのに問題があります。製品はおそらくバックボーン モデルになると思います。

var ProductModel = Backbone.Model.extends({
  defaults: {
    src: '',
    title: 'Product'
    brand: 'ABC'
  }
});

それから次の部分で行き詰まりました。私の考えでは、コレクションはデータのリストのようなものです。ただし、このシナリオでは、製品の全リストを表示するのではなく、3 つの製品のみが必要です。次に、ビューはどうですか？ビューは一度に 3 つの画像すべてをレンダリングする必要がありますか、それとも一度に 1 つの画像をレンダリングする必要がありますか (レンダリングを 3 回呼び出すなど)。残りの 2 つのセクションをレンダリングする必要があることを覚えておいてください (そして、それらはすべて異なる製品を示しています)。

一度に 3 つの画像のみで応答するように HTTP GET 呼び出しを制御する必要がありますか、それともすべての製品を返すようにする必要がありますか?

誰かが私を助けてくれるか、同様のユースケースの例をいくつか教えてください。

4

1 に答える 1

0

製品のコレクション、製品のモデル、ページのビュー、そして各製品のビューが必要です。アイデアは、ページ ビューからコレクションをフェッチし、それをループして各製品をレンダリングすることです。

各製品のビューを持つ利点は、各製品にイベント (クリック イベントなど) を簡単に割り当てることができることです。

HTTP GET から取得する画像の量は、用途とオーバーヘッドによって異なります。API に変数を追加して、応答で取得する画像の量をアプリケーションが制御できるようにすることを検討してください。

無限スクロールとバックボーンを含むこの例を見てください。

于 2012-12-04T10:55:03.867 に答える