Question

我已经看到了如何做到这一点的几种方法，但我永远无法弄清楚哪种方式是'正确'。

Jeffrey Way from NetTuts+和Addy Osmani实例化“主”应用程序视图以启动其应用程序。

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

Ryan Bates from Railscasts通过实例化路由器然后处理后续请求来启动他的应用程序：

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

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

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

这两种引导应用程序的方式之间是否有重要区别？

我非常喜欢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未定义。这里一定是做错了吗？

Answer 1

当你创建时：

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

与以下内容完全不同：

class App.Views.LoginView extends Backbone.View

您可以从coffee to 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's backbone-require setup的回购。

我有一个coffeescript todo setup松散地基于一个没有附加到窗口的全局app对象，但使用子对象来保存集合，模型，视图等。

引导Backbone应用程序

1 个答案: