如何在dojo中完成先前的函数后才执行函数

时间:2016-05-23 09:47:31

标签: javascript dojo

我试图在dojo domready块中连续执行4个函数,并且我想在执行这些函数后设置一个布尔标志,但所有函数都是异步触发并且标志在完成之前设置这些函数即函数不等待前一个函数完成,它们都刚刚启动并移动到下一个函数。

    require([ 'dojo/domReady!' ], function() {
        boolean flag=false;
        function1();
        function2();
        function3();
        function4();
        flag=true;
    });

如何仅在执行所有4个函数后设置标志

我正在分享我的原始代码,首先我在dojo ready中执行初始调用,我首先将标志onload设置为false

require([ 'dojo/domReady!' ], function() {
    onload = false;
    getQuoteOption();
});

然后在函数'getQuoteOption()'中我发出一个ajax调用来获取一些json数据

    function getQuoteOption(){
        var reqParams = addQuoteReqParams(reqParams);//getting json input data
        var request = require("dojo/request");
        request.get(url, {
            query : {
                inputJson : reqParams
            },
            handleAs : "json",
            preventCache : true
        }).then(function(response) {
            configureQuoteFieldData(response);
            configureIrregularFrequencyData(response);
            onload=true;
        }, function(error) {
            console.log(error);
        });
}

在ajax调用的回调中我正在执行两个函数'configureQuoteFieldData(response)'和'configureIrregularFrequencyData(response)'然后将标志onload设置为true,认为两个以前的函数已完全执行但是标志onload已设置在此之前是真的。

引用我在这里列出两个功能

 function configureQuoteFieldData(quoteFieldData) {
  var registry = require("dijit/registry");
  registry.byId('form_quoteData').set('value', quoteFieldData);//setting data to form 
 }



 function configureIrregularFrequencyData(obj) {
    var tmpArray = [];
        for (var i in obj) {
            tmpArray.push(obj[i]);
        }
        irregularPayMonths['irregularData'] = tmpArray;//saving to global variable

    }

3 个答案:

答案 0 :(得分:0)

您必须编写函数来接受回调或返回promise。然后用它触发后续函数,而不是立即调用它。

答案 1 :(得分:0)

共享代码片段后,将在执行所有4个函数后设置该标志。但是,这并不意味着它已经完成了执行这些功能中的所有逻辑。如果在这些函数中有一些异步调用,那么它们将在设置标志后执行。

如果您可以在这些功能中共享代码,那么我们可以提供更具体的解决方案。

更新: 我相信获取注册表的代码可能会导致问题。

var registry = require("dijit/registry");

如果尚未从服务器检索到js文件,则需要获取该文件。这可能就是你的情况。尝试每个脚本文件只有一个单独的需求。这样就可以在执行之前检索所有必需的文件。

require(["dijit/registry","dojo/request", "dojo/domReady!"], function(registry, request) {

    function getQuoteOption(){
        var reqParams = addQuoteReqParams(reqParams);//getting json input data
        request.get(url, {
            query : {
                inputJson : reqParams
            },
            handleAs : "json",
            preventCache : true
        }).then(function(response) {
            configureQuoteFieldData(response);
            configureIrregularFrequencyData(response);
            onload=true;
        }, function(error) {
            console.log(error);
        });
    }

    function configureQuoteFieldData(quoteFieldData) {
        registry.byId('form_quoteData').set('value', quoteFieldData);//setting data to form 
    }

    function configureIrregularFrequencyData(obj) {
        var tmpArray = [];
        for (var i in obj) {
            tmpArray.push(obj[i]);
        }
    }

    onload = false;
    getQuoteOption();
});

确保模块的顺序和相应的功能参数匹配。

答案 2 :(得分:0)

考虑使用dojo/promise/alldojo/Deferred,我们的想法是使用@Quentin提到的延迟对象。

下面是一个特别使用dojo框架的实例。

https://jsfiddle.net/9khdr4qa/

说明:

  • 代码运行3个异步返回的函数,每个函数在setTimeout()指示的不同时间返回。

  • 现在,只有在返回并完成所有3个函数后,您才希望将标志设置为true。

  • 解决方案在每个函数中包含一个延迟对象。当函数返回延迟对象时为Fulfilled

  • 使用dojo/promise/all检测何时返回所有3个函数。基本上,只有在所有3个延迟对象都标记为Fulfilled之后,它才会运行回调。

  • 然后将flag设置为true并继续使用您的代码。

您可以在此处阅读有关dojo promises和deferred对象的更多信息:

http://dojotoolkit.org/reference-guide/1.10/dojo/promise.html

https://dojotoolkit.org/reference-guide/1.10/dojo/Deferred.html

require(["dojo/promise/all", "dojo/Deferred", "dojo/dom", "dojo/on", "dojo/json", "dojo/domReady!"],
  function(all, Deferred, dom, on, JSON) {
    var flag = false;

    function requestA() {
      var deferred = new Deferred();
      setTimeout(function() {
        deferred.resolve("requestA");
      }, 500);
      return deferred.promise;
    }

    function requestB() {
      var deferred = new Deferred();
      setTimeout(function() {
        deferred.resolve("requestB");
      }, 750);
      return deferred.promise;
    }

    function requestC() {
      var deferred = new Deferred();
      setTimeout(function() {
        deferred.resolve("requestC");
      }, 1000);
      return deferred.promise;
    }

    on(dom.byId("startButton"), "click", function() {
      dom.byId("output").innerHTML = "Running...";
      all([requestA(), requestB(), requestC()]).then(function(results) {
        dom.byId("output").innerHTML = JSON.stringify(results);
        flag = true;
        alert('Your flag is set to: ' + flag);
      });
    });

  });
<h1>Click to start:</h1>
<pre id="output"></pre>
<button type="button" id="startButton">Start</button>