封装ajax，让调用变得简单优化

思考一下：

通常我们在使用ajax来发送接口请求时，每一次都会调用ajax固定的元素，比如data、url、method、success、error等。那么我们想一下能不能先把ajax封装起来，在每次发送请求时只需要把参数传入，实现封装函数的调用就可以。

这样的话，每次请求都会变得简单优化，节省了很多行冗余的代码，不是嘛。。。。。

　   接下来，我把代码实例写在下面。

1、假设现在需要发送一个接口请求。

var fun;//定义一个载体。
fun.viewProducts(id).then((response) => {
    //商品列表
    this.productlist = response;
}).catch(error =>{
　　//失败的回调
})

2、此时需要定义一个viewProducts的函数，来实现请求接口的功能。

viewProducts(uid){ 
　 var url =  '****';//接口的地址
 　return createRequestPromise({ 
    url: url,
    method:"POST", 
    data:{UserId:uid} 
});
}

3、在上面的代码中函数传入ajax的参数，即实例化ajax的请求。接下来需要封装ajax的功能，把data、url、method、success、error都封装起来。

function createRequestPromise(options) {
    if(!(options && options.url)) {
        //没有请求地址的报错
    }
    $.ajax({
        url: options.url,
        method: options.method || "POST",
        data: options.data || {},
        dataType: 'json',
        xhrFields: {
            withCredentials: true
        },
        crossDomain: true,
        success: function(response) {
            //请求成功的回调
        },
        error: function(error) {
            //请求失败的回调
        }
    });
}

当然，封装函数随自己的需求，可以更加个性化的定制。

返回的样式图片，返回的信息提示等都可以通过实例的时候传入（每次都可以不同），或者封装中加入（所有的回调都相同），这个时候就需要自己去改装了。

后期使用的时候，这个仅待参考。