zoukankan      html  css  js  c++  java
  • 再次封装ajax函数,统一入口

    根据API写网页的时候,每个页面都需要ajax请求,每次都写一大堆请求,配置什么的太麻烦,于是打算封装一个ajax函数,统一调用:
    开始时是使用return返回ajax,如下:

    function createAjax(ajaxrequire) {
     	_url = ajaxrequire._urls;
     	_dataType = ajaxrequire._dataType;
     	_async = ajaxrequire._async
     	_method = ajaxrequire._method;
     	_data = ajaxrequire._data;
     	_data.token = token;
     	_data.device = 'weixin';
    
        return $.ajax({
            url: _url,
            dataType: _dataType,
            cache: false,
            async: _async,
            type: _method,
            data: _data,
            timeout:10000,
            error:function(data){
            	mui.alert(data.msg);
            }
        });
    }
    

    在如下Ogoods变量中填好需要的参数内容,然后就可以直接调用了

    var Ogoods = {
    	_urls:'api地址',
    	_data:{ },
    	_method:'post',
    	_dataType:'json',
    	_async:false
    };
    var data = JSON.parse(createAjax(Ogoods).responseText);
    

    变量data中保存着ajax请求返回的数据,但是这个方法有个bug,就是不能使用异步,当 async为true时会报错,也不知道是不是只是我写的有问题,
    于是考虑着还能不能用其他方式实现,嗯,写个回调函数应该就行了,

    $packageAjax = function (ajaxrequire,callback) {
        _url = ajaxrequire._urls;
        _dataType = ajaxrequire._dataType;
        _async = ajaxrequire._async
        _method = ajaxrequire._method;
        _data = ajaxrequire._data;
        _data.token = token;
        _data.device = 'weixin';
    
        $.ajax({
            url: _url,
            dataType: _dataType,
            cache: false,
            async: true,
            type: _method,
            data: _data,
            timeout:10000,
            success:function(data){
                 callback(data);
            },
            error:function(data){
                mui.alert(data.msg);
            }
        });
    }
    

    调用:

    var Ogoods = {
    	_urls:'api地址',
    	_data:{ },
    	_method:'post',
    	_dataType:'json',
    	_async:true
    };
    $packageAjax(Ogoods,function(data){
        //执行操作
    })
    

    这样ajax设为异步就没什么问题了,并且也不必每次都写配置选项了,很简单,却也实用。

  • 相关阅读:
    【大数据云原生系列】大数据系统云原生渐进式演进最佳实践
    Apache Flink on K8s:四种运行模式,我该选择哪种?
    Istio 运维实战系列(2):让人头大的『无头服务』-上
    istio 常见的 10 个异常
    Prometheus Metrics 设计的最佳实践和应用实例,看这篇够了!
    腾讯会议大规模使用Kubernetes的技术实践
    腾讯云推出云原生etcd服务
    Regionals 2014 Asia
    HDU1754 I Hate It splay
    HNOI2002 营业额统计 splay
  • 原文地址:https://www.cnblogs.com/dxzg/p/7661412.html
Copyright © 2011-2022 走看看