1

我目前正试图围绕 require.js 库进行思考，但我遇到了一个问题，即使我遇到了问题，似乎也无法解决它。我首先创建了一个 main.js 文件：

/*
 *
 * Require.js configuration for app
 */
require.config({
 baseUrl: 'assets/js',
 paths:{
    "async": 'vendor/requirejs-plugins/async',
    "jquery": "http://cdnjs.cloudflare.com/ajax/libs/jquery/1.8.3/jquery.min",
    "common": "modules/common",
    "jquery-fineuploader": "vendor/jquery-fineuploader/jquery.fineuploader-3.0",
    "google" : "vendor/google/maps/google.init",
    "jqueryui" : "vendor/jquery-ui/jquery-ui-1.9.2.custom.min",
    "jqcookie": "http://cdnjs.cloudflare.com/ajax/libs/jquery-cookie/1.2/jquery.cookie.min"
},
shim: {
    'jqueryui': {
        deps: ['jquery']
    },
    'bootstrap' : {
        deps: ['jquery']
    },
    'common': {
        deps: ['jquery', 'bootstrap']
    },
    'google': {
        deps: ['jquery' , 'bootstrap']
    },
    'index':{
        deps: ['jquery' , 'bootstrap']
    },
    'jqcookie': {
        deps: ['jquery']
    },
    'jquery-fineuploader': {
        deps: ['jquery']
    }
}
 });

 require(["google", "index"], function() {
// Bisous 
 });

该文件旨在加载我的应用程序运行所需的各种文件。

然后，为了保持整洁，我创建了一个 common.js 文件，作为我的常用助手模块：

//Calling define with module ID, dependency array, and factory function
define(['jquery', 'bootstrap'], function () {

return{
    /*
     *
     * All-in-one modal content handler
     *
     */
    modalRefresh : function(redirectUrl, method, data){

        console.log(redirectUrl);
        console.log(method);
        console.log(data);

        $.ajax({
            url: redirectUrl,
            type: method,
            dataType: "json",
            data: (data) ? data : '',
            success: function( json, textStatus, xhr ) {

                if(json.redirect){
                    modalRefresh(json.redirect, 'GET');
                    return false;
                }

                if(!$('#submitDialog').length){
                    console.log('not found');

                    $('<div class="modal hide fade submitModal" id="submitDialog">' + json.data + '</div>').modal();
                }else{

                    console.log('found');
                    $('#submitDialog').empty().html(json.data);
                }
            },
            error: function( xhr, textStatus, errorThrown ) {}
        });
    }
}
});

该文件目前仅包含我在整个应用程序中处理我的对话框窗口所需的内容，即使它旨在在不久的将来处理更多的应用程序帮助程序。

我的问题是我似乎无法访问 modalRefresh 执行以下操作：

define(['jquery','jqueryui', 'bootstrap','common','async!http://maps.googleapis.com/maps/api/js?key=AIzaSyA9NdU3m2ysLvAiK1vjHnba3yQtck-pSFE&sensor=false',"vendor/google/maps/clusterer.min", "tmp/clusteringData"],
function(common){
  common.modalRefresh('test/call','POST', data = {test : 1});  
});

我真的怀疑我的模块没有按应有的方式实现，因为我找不到问题所在。感谢您的帮助！

4

1 回答 1

1

您的函数参数需要匹配它之前的数组中的参数。

换句话说：

define(['jquery','jqueryui', 'bootstrap','common','async!http://maps.googleapis.com/maps/api/js?key=AIzaSyA9NdU3m2ysLvAiK1vjHnba3yQtck-pSFE&sensor=false',"vendor/google/maps/clusterer.min", "tmp/clusteringData"],
function(common) {...

应该：

define(['jquery','jqueryui', 'bootstrap','common','async!http://maps.googleapis.com/maps/api/js?key=AIzaSyA9NdU3m2ysLvAiK1vjHnba3yQtck-pSFE&sensor=false',"vendor/google/maps/clusterer.min", "tmp/clusteringData"],
function(jquery, jqueryui, boostrap, common) {...

当然，对于不直接使用的导入（例如 jQuery），您不需要参数，所以我为避免编写它们所做的就是将此类导入放在最后。换句话说，我会将你的重写define为：

define(['common', 'jquery','jqueryui', 'bootstrap', 'async!http://maps.googleapis.com/maps/api/js?key=AIzaSyA9NdU3m2ysLvAiK1vjHnba3yQtck-pSFE&sensor=false',"vendor/google/maps/clusterer.min", "tmp/clusteringData"],
function(common) {...
于 2012-12-13T20:52:51.447 回答