美文网首页
回调函数

回调函数

作者: 一名有马甲线的程序媛 | 来源:发表于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,是我自定义的方法,相关教程点击查看

相关文章

  • JavaScript函数_08回调函数

    回调函数 回调函数(回调),当我们把某个函数作为参数传递给另一个函数的时候,这个函数就是回调函数 回调函数的基本写...

  • Promise

    回调 把一个函数A传给另一个函数B调用,那么A就是回调函数。 回调地狱 回调套回调套回调套回调套回调套回调套回调....

  • 回调函数与promise

    回调 把一个函数A传给另一个函数B调用,那么A就是回调函数 具名回调写法 匿名回调写法 多层嵌套的匿名回调(回调地...

  • 回调函数与promise

    回调 把一个函数A传给另一个函数B调用,那么A就是回调函数 具名回调写法 匿名回调写法 多层嵌套的匿名回调(回调地...

  • javascript回调函数

    javascript回调函数很玄幻。 jquery 中大量使用了回调函数。直到现在才看懂 普通回调函数 匿名回调函...

  • 异步的实现

    异步的三种实现方式: 回调函数事件Promise 回调函数 回调函数不一定是异步 但是异步一定是回调函数。 事件 ...

  • JavaScript系列之回调函数callback

    JavaScript系列之回调函数callback JavaScript回调函数的使用是很常见的,引用官方回调函数...

  • mqtt python包回调分析

    mqtt的python包,回调函数比较复杂,每次在连接之前,需要先实现回调函数,回调函数的传入参数固定 将回调函数...

  • Android使用suspendCancellableCorou

    普通的回调函数: 回调方法,模拟耗时操作 去掉回调,转换为挂起函数:

  • Promise

    回调 把一个函数A传给另一个函数B调用,那么A就是回调函数一个最基本的具名回调匿名回调 回调地狱匿名回调嵌套过多层...

网友评论

      本文标题:回调函数

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