Backbone.js：我應該將jQuery設置放在哪里？

Question

我正與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應用程序完全分開？

Answer 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);
    }
});

Answer 2

嗯...對不起，如果我英語不好的話我錯過了一些細節。 但是，正如我所看到的，您的問題的重點是：您可以在哪里配置和放置與Backbone不相關的jQuery內容？ 總之，您可以分隔此代碼，然后將其鏈接到.html中

骨干只是一點MVC。 您可以在Backbone.View.extend({...})操縱渲染器的功能以及與視圖相關的一些js東西，但是總的來說，我認為為不同的東西制作不同的結構是個好主意。 像這樣：

.../
   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..

因此，正如我認為的那樣，該結構可以幫助您理解什么是源代碼，並使您的編碼清晰明了。

希望對您有幫助。 對不起，我誤會了。