1

Backbone Bolierplate 内で LayoutManager を使用する方法について、誰かが説明/例を提供できますか?

app.js 内で、メインのアプリ オブジェクトを拡張する useLayout 関数を確認できます。ここでは、基本レイアウト要素を設定しているようです:

// Helper for using layouts.
    useLayout: function(name, options) {
      // Enable variable arity by allowing the first argument to be the options
      // object and omitting the name argument.
      if (_.isObject(name)) {
        options = name;
      }

      // Ensure options is an object.
      options = options || {};

      // If a name property was specified use that as the template.
      if (_.isString(name)) {
        options.template = name;
      }

      // Create a new Layout with options.
      var layout = new Backbone.Layout(_.extend({
        el: "#main"
      }, options));

      // Cache the refererence.
      return this.layout = layout;
    }

あれは正しいですか?もしそうなら、どうにかしてアプリケーション ルーターで「UseLayout」機能を使用できますか? ...さまざまな UI 要素/ネストされたビューをメイン ビューに追加するには?

ありがとう。

4

2 に答える 2

1

通常の Backbone を使用しているかのように使用できますViewViewを直接構築する代わりに、これを使用して新しいインスタンスを作成できます。投稿したコードは、オーバーライド可能なデフォルト要素として設定されobjectBackbone Layout Manager拡張機能のラッパーです。el: #mainView

var layout = new useLayout({ template: "#viewElement", ... });
于 2013-01-30T14:07:18.013 に答える
1

通常、アプリケーション全体で必要なすべての設定を格納する「アプリ」オブジェクトがあります。次に、このオブジェクトは、上に挙げたようないくつかの便利な機能を拡張します。例えば:

var app = {
  // The root path to run the application.
  root: "/",
  anotherGlobalValue: "something",
  apiUrl: "http://some.url"
};

// Mix Backbone.Events, modules, and layout management into the app object.
return _.extend(app, {
    // Create a custom object with a nested Views object.
    module: function(additionalProps) {
      return _.extend({ Views: {} }, additionalProps);
    },

    // Helper for using layouts.
    useLayout: function(options) {
      // Create a new Layout with options.
      var layout = new Backbone.Layout(_.extend({
        el: "#main"
      }, options));

      return this.layout = layout;
    },

    // Helper for using form layouts.
    anotherUsefulFunction: function(options) {
      // Something useful
    }

  }, Backbone.Events);

});

今私のルーターで私は次のようなことをします:

app.useLayout({ template: "layout/home" })
  .setViews({
    ".promotional-items": new Promotions.Views.PromotionNavigation(),
    ".featured-container": new Media.Views.FeaturedSlider({
      vehicles: app.vehicles,
      collection: featuredCollection
    })
}).render().then(function() {
  //Do something once the layout has rendered.
});

私は自分のアプリケーションの 1 つからサンプルを取得したところですが、アイデアを理解していただけると確信しています。私のメイン レイアウトは、基本的に、ビューをそれぞれのホルダーに挿入できるように、要素を保持する単なるレイアウト テンプレート ファイルです。

于 2013-01-31T07:46:01.630 に答える