5

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

来自 NetTuts+ 的 Jeffrey Way 和Addy 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()

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

我非常喜欢 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;
});

还有我的登录视图：

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

  });



  return LoginView;
});

为了遵循 Ryan Bates 的工作方式，我想做一些类似的事情：

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

但我不太确定这与他在咖啡脚本中所做的有什么不同：

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

您可以通过将咖啡脚本从咖啡转换为 js来检查咖啡脚本：

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 的主干需要设置的存储库。

我有一个coffeescript todo设置，它松散地基于两个未附加到窗口的全局应用程序对象，但使用子对象来保存集合、模型、视图等。

于 2013-05-15T20:19:31.620 回答