1

簡単なアプリケーションを作成するために backbone.boilerplate を使用します。

サイトのコレクションを表示できるモジュールを作成したいと考えています。各サイトには id 属性と title 属性があります (例[{ id: 1, title: "github.com" }, { id: 2, title: "facebook.com" }].

私のルーター：

routes: {
  "": "index",
  "sites": "sites"
},

sites: function () {
  require(['modules/sites'], function (Sites) {
    var layout = new Sites.Views.Layout();
    app.layout.setView('#content', layout);
  });
}

したがって、私のサイトモジュールにはレイアウトがあり、これは次のことを行います:

Sites.Views.Layout = Backbone.Layout.extend({
  template: "sites/layout",
  className: 'container-fluid',

  initialize: function () {
    _.bindAll(this);

    this.collection = new Sites.Collections.Sites();
    this.collection.fetch({
      success: this.render
    });
  },

  beforeRender: function () {
    var siteList = new Sites.Views.SiteList({
      collection: this.collection
    });

    this.setView('.content', siteList);
  },
});

Sites.Views.SiteList = Backbone.View.extend({
  template: 'sites/list',

  beforeRender: function () {
    this.collection.each(function (model) {
      var view = new Sites.Views.SiteItem({
        model: model
      });
      this.insertView('tbody', view);
    }, this);
  }
});

Sites.Views.SiteItem = Backbone.View.extend({
  template: 'sites/item',
  tagName: 'tr',

  serialize: function () {
    return {
      title: this.model.get('title')
    };
  }
});

わかった。そして今、私の質問: ユーザーがコレクションの要素をクリックしたときに、1 つのサイト ビューをレンダリングする最良の方法を選択してください。gmail のように機能することを望みます。1 つの画面ですべての文字を表示し、すべての画面で 1 つの文字を表示することを選択した場合。たぶん、同様のアプリケーションの例へのリンクがあります。アドバイスをお待ちしています。

4

1 に答える 1

0

Pastebin コードを見ると、Backbone の基本的な理解があるように見えます。これだけで、作業を開始することができます。

そうは言っても、この記事/チュートリアルが役立つかもしれません。<select>AJAX を使用して値を更新する、相互に接続されたビュー (チュートリアルでは関連する要素) を構築するプロセスを順を追って説明します。

http://blog.shinetech.com/2011/07/25/cascading-select-boxes-with-backbone-js/

于 2013-03-27T20:25:39.083 に答える