执行两个语句之间需要延迟

时间:2013-05-22 09:41:28

标签: javascript extjs extjs4.1 extjs4.2

我正在使用extjs 4.2,在一个地方,我正在加载这样的商店对象:

var  userDetailStore = Ext.create('Ext.data.Store', {
    model : 'Person.DetailsModel',
    autoLoad : true,

    proxy : {
        type : 'ajax',
        method : 'POST',
        url : 'getValueAction.action',
        reader : {
            type : 'json',
            root : 'details'
        },
        writer : {
            type : 'json',
            root : 'details'
        }
    },
    fields : ['id','loginName','referenceId' ,'name']
});//Here I load the store which will definitely contain a list of values.

并且在下一行中我想从商店对象中获取第一个值的referenceId,如下所示

var empId =  userDetailStore.getAt(0).get('referenceId')

我收到错误,因为到目前为止,商店对象userDetailStore的getCount()给我零。但是如果我写一个警告语句,如警告('加载数据'); 之前我获取referenceId的行然后代码工作正常。 userDetailStore.getCount()行给了我确切的值。

所以我认为在加载商店然后使用商店之间需要一些延迟,但我不想要显示警报。我甚至使用了 sleep()方法警告声明的地方。但这也无效。(顺便说一下,我甚至不想通过执行 sleep()来冻结浏览器)

我在加载商店时做错了什么?有没有通用的方法,以便在商店完全加载后我将执行我的代码以使用商店?

有人请帮帮我......

问候: 开发

3 个答案:

答案 0 :(得分:1)

使用load事件来获取完全加载后的计数

userDetailStore.on('load', function(){
                alert("Fully loaded");
            });

答案 1 :(得分:1)

维杰的回答是正确的,但我认为我会扩展这个概念,以便明确这个答案如何适合你正在做的事情。

了解当您发出AJAX请求时,请求是异步的,这一点很重要。实际上这意味着(正如您所发现的),调用脚本的其余部分不会等待以完成异步过程。相反,在您发出异步请求的那一刻,您的脚本将以快乐的方式继续,执行下一行代码。

因此,如果您考虑一下,这就完全可以理解为什么您没有在商店中看到“数量”。当您的异步请求正在进入服务器,获取结果,然后将其返回到您的请求时,其余代码仍然正确执行,无视异步请求中发生的事情(这正是为什么异步请求功能强大且令人敬畏。)

这也是添加警报似乎“修复”您的问题的原因。当您调用alert()时,您会在警报点停止执行脚本。但是,由于您对数据的请求是异步的,因此您单击警报的“确定”按钮(因此恢复处理脚本)所花费的时间使异步请求有足够的时间来完成其生命周期并更新原始调用对象。

鉴于此,可以理解为什么“延迟”似乎是一种理想的方式,因为警报的“延迟”(或真正“停止”)修复了你的问题(至少在表面)。但是,对于异步请求,您永远不会真正知道需要多长时间才能完成。如果您有大的响应,或者存在异常的网络延迟或任何其他数量的问题......硬编码延迟可能会起作用,但也可能不起作用。最令人抓狂的是,你永远不会得到一致的结果,并且会不断增加“延迟”,以便适应所有可能导致你的异步请求花费更长时间的事情。

这就是为什么商店的load()事件(以及回调)是理解和实现的关键概念。通过侦听load()事件,然后仅在该事件触发的上下文中执行您需要的代码,您可以确定存储的数据异步请求已完成。

如果您以前没有使用过回调和事件处理,那么为了突破线性的程序性思维,需要花一些时间来完成它。但是,在处理一般的AJAX请求和特别是ExtJS 4等事件驱动的框架时,为了构建有效且一致的应用程序,需要采用这个概念。

答案 2 :(得分:0)

  

此处将自动加载设置为 false ,在某些操作中,您可以使用 load()加载商店。

store.load({
    callback: function(records, operation, success) {
        // do something after the load finishes
    },
    scope: this
});