如何將我的JavaScript MVC代碼組織到AMD模塊中？

我建立各種可視化組件的Web應用程序，由Backbone.js的模型和視圖的：如何將我的JavaScript MVC代碼組織到AMD模塊中？

的「PopulationVisualization成分」可能例如有：

主模型 - 存儲組件的狀態
幾個骨幹次（timesliderView，legendView等） - 聽變化對本模型

所有這些組件的依賴於外部dataManagers和dataSource對象，但是否則它們應該被解耦。

在給定的頁面上，我想實例化一個PopulationVisualization組件的實例。我還想傾聽該組件主模型的更改，以便可以在URL中序列化其狀態。

1）如果我嘗試採用AMD模塊模式，這會是什麼樣子？
2）我會製作PopulationVisualization組件的幾個模塊嗎？
3）我會暴露模塊級方法作爲一個API或我會提供內部模型和視圖的直接操縱？

謝謝。

來源

2011-11-25 dani

要回答你的問題，這是我的意見，回答所有三個：

模塊應儘可能小，所以我會爲每個視圖創建，一個模塊一個新的模塊，以及一個用於序列化邏輯。然後我會創建一個將所有這些關聯在一起的模塊，以便外部代碼不必處理模型，視圖或序列化。

這是我在這樣的第一個嘗試：

// components/populationVisualization/Model.js 
define(function (require, exports, module) { 
    return Backbone.Model.extend({ /* ... */}); 
}); 

// components/populationVisualization/views/Timeslider.js 
define(function (require, exports, module) { 
    return Backbone.View.extend({ /* ... */}); 
}); 

// components/populationVisualization/views/Legend.js 
define(function (require, exports, module) { 
    return Backbone.View.extend({ /* ... */}); 
}); 

// components/populationVisualization/serializer.js 
define(function (require, exports, module) { 
    exports.setupSerialization = function (model) { 
    // ... 
    }; 
}); 

// components/populationVisualization.js 
define(function (require, exports, module) { 
    var Model = require("./populationVisualization/Model"); 
    var TimesliderView = require("./populationVisualization/views/Timeslider"); 
    var LegendView = require("./populationVisualization/views/Legend"); 
    var serializer = require("./populationVisualization/serializer"); 

    exports.createAndRender = function (modelParams, $el) { 
    var model = new Model(modelParams); 
    serializer.setupSerialization(model); 

    var timesliderView = new TimesliderView({ model: model }); 
    var legendView = new LegendView({ model: model }); 

    $el.append(timesliderView.el); 
    $el.append(legendView.el); 
    }; 
});

在亞洲其他應用程序，你只會3210並調用該模塊的createAndRender方法以及相應的參數。

來源

2012-02-08 05:23:19 Domenic

如何將我的JavaScript MVC代碼組織到AMD模塊中？

回答

相關問題