前端js函数的封装,用对象入参的方式比单一传值好用,以jq+layer发送ajax封装为例

这种入参方式可以覆盖默认的配置,而不用每个参数单独写到函数入参。封装了一个ajax请求(基于jquery、layer):

/**
 * Ajax请求接口
 * @param options
 */
function sendDataBs(options) {
    let config = {
        data: {},
        url: '',
        type: 'post',
        dataType: 'json',
        async: true,
        showDoing: true,
        showDoingTimeout: 2000,
        showDoingTitle: '',
        showMsg: true,
        callback: null,
    }
   if (typeof options == 'object') {
       config = Object.assign(config, options);
   }
    $.ajax({
        async: config.async,
        url: config.url,
        type: config.type,
        data: config.data,
        dataType: config.dataType,
        beforeSend: function () {
            if (config.showDoing) {
                layer.msg(config.showDoingTitle || '执行中,请勿操作其他或关闭!!!', {
                    icon: 6,
                    time: config.showDoingTimeout
                })
            }

        },
        success: function (res) {
            if (config.showMsg) {
                layer.msg(res.msg, {
                    time: res.code == 0 ? 500 : 2000,
                    icon: res.code == 0 ? 6 : 5
                }, function () {
                    if (typeof config.callback == 'function') {
                        config.callback(res)
                    }
                })
            } else {
                if (typeof config.callback == 'function') {
                    config.callback(res)
                }
            }

        },
        error: function () {
            layer.msg('请求异常')
        }
    })
}


调用实例参:

sendDataBs({
    data: {title:title},
    url: "<{:url('马卡马克/ai_article')}>",
    showDoingTimeout: 60000,
    showDoingTitle: 'AI正在生成中,请勿关闭页面....',
    callback: function (res) {
        if (res.code ==0){
            $summernote.summernote('code', res.data.content)
        }
    },
})


评论/留言