• extjs ajax 回调函数作用域的问题


        extjs 的某个panel在调用Ext.ajax时,回调成功,执行success指定的方法,这个方法的作用域会修改为最上层的网页,导致回调方法不能通过this.items.get()找到对应的控件,只能通过Ext.getCmp()从整个网页查找,这样ID相同的控件都会被修改。

        在extjs 4之前,应该是通过委托来实现回调函数作用域的变化,使用createDelegate方法。

        在extjs 4.0.7 中, 通过Ext.Function.bind来修改回调函数的作用域

    bind( Function fn, [Object scope], [Array args], [Boolean/Number appendArgs] ) : Function

     1 /*
     2 request               : 傳入參數
     3 successCallback       : 后台执行成功后,执行的回调方法
     4 failureCallback       : 后台执行失败后,执行的回调方法
     5 caller                : 调用AccessData方法的窗体,通过这个参数,可以在回调方法中访问调用窗体中的变量
     6 在调用这个方法时,如果前面的参数不需要,但需要后面的参数,则需要使前面的参数传入null.
     7 */
     8 function AccessData(request,successCallback,failureCallback,caller)
     9 {
    10     //设置Content-Type为application/json形式
    11     Ext.Ajax.defaultPostHeader = 'application/json';
    12  
    13     //访问失败的统一回调函数
    14     var onFailure = function(r, opts)
    15     {      
    16         alert(r.responseText);
    17     }
    18     
    19     var onSuccess = function(response, options)
    20     {
    21          var obj = eval('(' + response.responseText + ')');
    22             
    23             if(0 == obj.AccessDataResult.Result)
    24             {
    25                 if(null != successCallback)
    26                 {
    27                     if(null == caller)
    28                     {
    29                         successCallback(obj.AccessDataResult.OutMsg); 
    30                     }
    31                     else
    32                     {           
    33                         //定义回调函数的作用域为调用者                                 
    34                         var successCallbackDelegate = Ext.Function.bind(successCallback,caller);                        
    35                         successCallbackDelegate(obj.AccessDataResult.OutMsg);
    36                     }
    37                 }
    38             }
    39             else if(99 == obj.AccessDataResult.Result)
    40             {
    41                 InitLogin();
    42             }
    43             else
    44             {
    45                 if(null != failureCallback)
    46                 {
    47                     if(null == caller)
    48                     {
    49                         failureCallback(obj.AccessDataResult.OutMsg);
    50                     }
    51                     else
    52                     {
    53                         var failureCallbackDelegate = Ext.Function.bind(failureCallback,caller);                        
    54                         failureCallbackDelegate(obj.AccessDataResult.OutMsg);
    55                     }
    56                 }
    57                 else
    58                 {
    59                     alert(obj.AccessDataResult.OutMsg);
    60                 }
    61             }
    62     }
    63     
    64     //如果request.parm.Parms是一个JSON对象,则需要将其先转换为字符串,
    65     //主要是因为后台的WCF接口,只接受字符串参数.如果直接传入JSON对象,
    66     //则后台参数需定义为object,也不是很方便解析
    67     request.parm.Parms = Ext.JSON.encode(request.parm.Parms);
    68    
    69     Ext.Ajax.request(
    70     {  
    71         url: './wcf/ExampleWcf.svc/AccessData',//要访问的方法地址
    72         method: 'POST', 
    73         params: Ext.JSON.encode(request), //把输入参数进行JSON编码
    74         scope: caller, //缓存回调函数作用域
    75         success: onSuccess,
    76         failure: onFailure 
    77      });
    78 }

  • 相关阅读:
    如何进行市场洞察?
    敏捷开发团队的四种组织形式
    RxJava + Retrofit源码解析
    Node.js基础入门第七天
    Node.js基础入门第十天
    Node.js基础入门第八天
    Node.js基础入门第九天
    android 线程更新UI的问题
    svelte组件:svelte3自定义桌面PC端对话框组件sveltelayer
    进程通讯 & Binder机制 & Service 笔记
  • 原文地址:https://www.cnblogs.com/baishahe/p/2523505.html
Copyright © 2020-2023  润新知