8

我开始掌握 Backbone.js，但我不明白的一件事是把设置页面所需的所有一次性 jQuery 代码放在哪里。

你知道这样的事情：配置一个 jQuery 轮播插件，添加一个“滚动到顶部”箭头......当用户第一次加载页面时发生的一次性配置。

目前我正在路由器中执行此操作：

 var AppRouter = Backbone.Router.extend({
  routes: {
    // some routes
  },
  initialize: function() {
    initializeJqueryStuff();
  } ...
 });
 var StateApp = new AppRouter();
 Backbone.history.start({
   pushState: true
 });
 function initializeJqueryStuff() { 
   // one-off jQuery stuff goes here
 }

哟呵。我应该怎么做？应该initializeJqueryStuff是Router对象的另一个属性吗？这一切都应该住在里面initialize吗？或者我真的应该将此代码与 Backbone 应用程序完全分开吗？

4

2 回答 2

1

我通常定义一个LayoutView，即一个根视图，它负责呈现应用程序中的所有“实际”视图。此布局视图仅在需要运行任何其他视图代码之前初始化一次。这也是我倾向于进行任何一次性视图配置的地方。

样本：

//LayoutView should be considered a singleton, only initialized once
var LayoutView = Backbone.View.extend({
    el:'body',

    initialize: function() {
        this.initializeSomejQueryStuff();
    },

    renderChild: function(child) {
        if(this._currentChild)
            this._currentChild.remove();
        this._currentChild = child;
        this.$el.html(child.render().el);
    },

    initializeSomejQueryStuff: function() {
        //init here
    }
});

用法：

var AppRouter = Backbone.Router.extend({
    routes: {
        "foo/:id": "foo"
    },

    initialize: function() {
        this.layout = new LayoutView();
    },

    foo: function(id) {
        var model = new Foo({id:id});
        var view = new FooView({model:model});

        //delegate the view rendering to a layout
        this.layout.renderChild(view);
    }
});
于 2013-02-01T13:29:37.700 回答
0

嗯...对不起，如果我因为我的英语不好而错过了一些细节。但是正如我所看到的那样，您的问题的重点是：您可以在哪里配置和放置与 Backbone 无关的 jQuery 内容？总之，您可以将这段代码分开，然后将其链接到 .html

主干只是一点点 MVC。你可以操纵你的渲染函数和一些与视图相关的js东西Backbone.View.extend({...})，但总的来说，我认为为不同的东西制作不同的结构是一个好点。像这样：

.../
   public/
         css/
         img/
         lib/
            ..any source code for your plugins..
         tpl/
            ..for your templates..
         js/
           models/
                 models.js
           views/
                ..your views.js..
           main.js(your backbone router and for example, .loadTemplate() func for templates and other)
           ..any code for plugings configuration..

所以我认为这种结构可以帮助理解什么是来源，并让你清楚地编码。

希望对您有所帮助。对不起，如果我误解了smth。

于 2013-02-01T09:39:19.723 回答