5

これを行う方法についていくつかの方法を見てきましたが、どれが「正しい」方法であるかはわかりません。

NetTuts+ の Jeffrey WayAddy Osmaniは、アプリケーションを開始するために「メイン」アプリケーション ビューをインスタンス化します。

require(['views/app'], function(AppView) {
  new AppView();
});

Railscasts の Ryan Bates は、後続のリクエストを処理するルーターをインスタンス化することでアプリケーションを開始します。

window.App =
    Models: {}
    Collections: {}
    Views: {}
    Routers: {}

    init: ->
        new App.Router()
        Backbone.history.start()
    }
}

$(document).ready ->
    App.init()

アプリケーションをブートストラップするこれら 2 つの方法に重要な違いはありますか?

Ryan Bates が作成したオブジェクトに彼のすべてのモデル、ビューなどを追加する方法がとても気に入ってAppいます...彼は CoffeeScript を使用していますが、これがこのオブジェクトの処理方法に違いをもたらすかどうかはわかりません。私はこれを試しましたが、RequireJSで動作させることができませんでした:

require(['jquery', 'backbone', 'router'], function ($, Backbone, Router) {
    window.App = {
        Models: {},
        Collections: {},
        Views: {},
        Aggregator: _.extend({}, Backbone.Events),
        Hook: $('#application'),
        Router: Router,

        init: function() {
            new App.Router();
            Backbone.history.start();
        }
    }
    $(document)ready(function() {
        App.init();
    });
});

次に、インデックス ルートにヒットしたときに loginView を作成する単純なルーターを作成します。

define(['backbone', 'loginView'], function(Backbone, LoginView) {
  var Router = Backbone.Router.extend({

    routes: {
      '': 'index'
    },

    index: function() {
      var loginView = new LoginView();
    }  

  });

  return Router;
});

そして私の loginView:

define(['backbone'], function(Backbone) {
  var LoginView = Backbone.View.extend({

  });



  return LoginView;
});

Ryan Bates の作業方法に従うために、次のようなことをしたいと思いました。

App.Views.LoginView = Backbone.View.extend({});

しかし、これが彼がcoffeescriptで行っていることとどう違うのかよくわかりません:

class App.Views.LoginView extends Backbone.View

LoginView のinitializeメソッドで「App」をコンソールに記録すると、main.js ファイルからオブジェクトが取得されますが、App.Views オブジェクトに何かをアタッチしようとすると、App.Views が未定義であると表示されます。ここで何か間違ったことをしているに違いありませんか?

4

1 に答える 1

0

作成時:

App.Views.LoginView = Backbone.View.extend({});

次のものとはかなり異なります。

class App.Views.LoginView extends Backbone.View

coffee から js に変換することで、coffeescript を確認できます。

var __hasProp = {}.hasOwnProperty,
__extends = function(child, parent) { for (var key in parent) { if (__hasProp.call(parent, key)) child[key] = parent[key]; } function ctor() { this.constructor = child; } ctor.prototype = parent.prototype; child.prototype = new ctor(); child.__super__ = parent.prototype; return child; };

App.Views.LoginView = (function(_super) {

  __extends(LoginView, _super);

  function LoginView() {
    return LoginView.__super__.constructor.apply(this, arguments);
  }

return LoginView;

})(Backbone.View);

todomvc の backbone-require setup のリポジトリを確認することをお勧めします。

ウィンドウにアタッチされていないグローバルアプリオブジェクトと、サブオブジェクトを使用してコレクション、モデル、ビューなどを保持する両方に大まかに基づいたcoffeescript todoセットアップがあります。

于 2013-05-15T20:19:31.620 に答える