封装ajax

简单的封装ajax

function ajax(opt) {
    // 不传参数的时候 初始化
    let default_opt = {
      // 请求路经
        url: '',
      // 请求方式
        method: 'GET',
        // 是否异步
        async: true,
        // 数据
        data: {},
        // 回掉函数
        success: null
    }
    // 合并对象
    let newOpt = Object.assign(default_opt, opt);

    // 兼容创建ajax
    let xhr = XMLHttpRequest ? new XMLHttpRequest() : new ActiveXObject('Microsoft.XMLHttp');

    // 监听事件
    xhr.onreadystatechange = function () {
        if (xhr.readyState === 4 && xhr.status === 200) {
            console.log(xhr.responseText)
            newOpt.success && newOpt.success(xhr.responseText)
        }
    }
    //判断是不是get
    let search = '';
    if(newOpt.method.toUpperCase() === 'GET'){
        search = '?' + Object.keys(newOpt.data).map(item => item+'='+newOpt.data[item]).join('&')
    }
    // 建立连接
    xhr.open(newOpt.method, newOpt.url + search, newOpt.async);

    let data = null;

    if(newOpt.method.toUpperCase() === 'POST'){
        xhr.setRequestHeader('Content-Type','application/x-www-form-urlencoded');
         data= bject.keys(newOpt.data).map(item => item+'='+newOpt.data[item]).join('&')
    }

    xhr.send(data)
}

调用

ajax({
    url: 'http://192.168.1.102:3000/api/data',
    method: 'POST',
    async: true,
    data: {
        pageNum: 1,
        pageSize: 10
    },
    success: function (data) {
        console.log(data)
    }
})