美文网首页
回调函数

回调函数

作者: 一名有马甲线的程序媛 | 来源:发表于2018-09-28 15:36 被阅读8次

    需求分析 & 运用场景:

    由于请求列表内容 后台返回数据需要时间,所以加loading显示效果更好;
    对列表项进行增加or删除,有弹窗提示成功or失败。
    步骤:点击删除,加载列表再提示“删除成功”;点击添加,加载列表再提示“添加成功”。
    这个时候就需要“回调函数”来调整弹窗显示顺序~

    加载列表代码:

    function getListData (id, callback) {
        myDialog.myLoading('show');
        var str = basepath + '/v1/group/query-hospital-list?groupId=' + id;
        $.ajax({
            url : str ,
            type: "get",
            data:"",
            dataType : 'json',
            contentType: 'application/json',
            mimeType: 'application/json',
            cache : false,
            success : function(res) {
                if (res.subCode == 'SUCCESS') {
                    var listStr = '';
                    if (res.data.length) {
                        listStr += '<colgroup>' +
                            '<col style="width: 200px;"></col>' +
                            '<col style="width: 300px;"></col>' +
                            '</colgroup>';
                        for (var i = 0; i < res.data.length; i++) {
                            listStr += '            <tr id="'+ res.data[i].id +'"  class="'+ res.data[i].groupId +'">';
                            listStr += '              <td class="hospitalName">' + res.data[i].hospitalName + '</td>';
                            listStr += '              <td>'+ res.data[i].hospitalId +'</td>';
                            if (res.data[i].agreeState == 'WATING') {
                                listStr += '              <td>等待同意</td>';
                            } else if (res.data[i].agreeState == 'YES') {
                                listStr  += '              <td>同意</td>';
                            } else if (res.data[i].agreeState == 'NO') {
                                listStr += '              <td>拒绝</td>';
                            } else {
                                listStr += '              <td></td>';
                            }
                            if (groupType == "MYGROUP") {
                                listStr += '              <td><span onclick="delMethod(this, \'hospital\')">删除</span></td>';
                            }
                            listStr += '            </tr>';
                        }
                    } else {
                        listStr += '<div class="listDataNone">暂无数据</div>';
                    }
                    $('.listData').empty().append(hospitalListStr);
                    myDialog.myLoading('hide');
                    /*********** 划重点 看这里 ***********/
                    typeof callback === "function" && callback();
                    /*这样写,在用到该函数不需要回调的时候也不会报错~*/
                    /*********** 划重点 看这里 ***********/
                }
            }
        })
    }
    

    删除信息,再调用加载列表代码:

          myDialog.myConfirm('确定要删除 <b>' + hospitalName + '</b> 医院吗?', function () {
              var isDelStr = basepath + '/v1/group/delete-hospital?id=' + id
              $.ajax({
                  url:isDelStr,
                  type:'put',
                  dataType:'json',
                  contentType:'application/json',
                  mimeType:'application/json',
                  success:function(res){
                      if (res.subCode == 'SUCCESS') {
                          /*********** 划重点 看这里 ***********/
                          getListData (groupId, function () {
                              myDialog.myAlert('删除成功',2000)
                          });
                          /*********** 划重点 看这里 ***********/
                      }
                  },
                  error:function(res){
                      console.log(res);
                  }
              })
          })
    

    这里的myDialog.myLoadingmyDialog.myAlertmyDialog.myConfirm,是我自定义的方法,相关教程点击查看

    相关文章

      网友评论

          本文标题:回调函数

          本文链接:https://www.haomeiwen.com/subject/nxrpoftx.html