0
在我所有的項目中,我使用以下方法來處理整個應用程序中的js。然而,我不喜歡我將變量傳遞給js中的模塊的方式:我在html上聲明它們,並在模塊中盲目地使用它們。Requirejs:傳遞參數時使用數據主入口點
所有的stackoverflow問題/答案我發現談論不同的設置和不使用這種數據主入口點的方法。
的index.html
<html>
<body>
<article class="row m-b-xxl settings" data-js="modules/home"></article>
<script>
var bar = 'foo';
</script>
<script src="require.js" data-main="main"></script>
</body>
</html>
main.js
require.config({
paths: {
'jquery': 'jquery.min',
'foundation': 'foundation.min'
},
shim: {
"foundation": {
deps: ['jquery'],
exports: 'Foundation'
}
}
});
// Load our app module 'main.js' and pass it to our definition function
requirejs(['app'], function (App) {
App.initialize();
});
app.js
// The base app
var widgetList = {};
define(['jquery', 'foundation' ], function ($, Foundation)
{
var initialize = function() {
// Set user agent
var doc = document.documentElement;
doc.setAttribute('data-useragent', navigator.userAgent);
// Do the widget loading
$('[data-js]').each(function() {
var scope = this;
requirejs([$(scope).data('js')], function (widget) {
var widgetDeclaration = new widget();
widgetDeclaration.init(scope);
widgetList[widgetDeclaration.name] = widgetDeclaration;
});
});
}
return {
initialize: initialize
};
}
);
模塊/ home.js
define(['jquery'], function ($) {
var Widget = function() {
};
Widget.prototype = {
name: 'Dashboard Home',
init: function (scope) {
"use strict";
console.log(bar);
};
return Widget;
});
那麼如何正確地傳遞配置參數模塊?