javascript - 多个甜蜜警报始终执行第一个确认回调

Question

当我在同一页面中使用多个甜蜜警报时，它总是调用第一个回调。

我解释一下:

我有一个发送好友请求的按钮，点击后会变成“待处理/取消”按钮

{{#if addFriend}}
    <li>{{> addFriendBtn user=usr}}</li>
{{/if}}
{{#if pending}}
    <li>{{> pendingFriendBtn user=usr}}</li>
{{/if}}

每个btn都有一个点击事件调用sweetalert:

Template.addFriendBtn.events({
'click .add-friend': function (evt,tpl) {
        console.log('inside click .add-friend...');
        const options = {
            title: "Friend request",
            showCancelButton: true,
            confirmButtonText: "Oui",
            closeOnConfirm: true,
            closeOnCancel:true,
            allowOutsideClick: false,
            allowEscapeKey:true
        };

        swal(options, function () {
           console.log("Inside add-friend confirmation swal...");
           Meteor.call('sendFriendRequest', tpl.data.user);
        });
   }
}); 

Template.pendingFriendBtn.events({
    'click .cancel-request': function (evt, tpl) {
        console.log('inside click .cancel-request');
        const options = {
                    title: "Confirmation",
                    showCancelButton: true,
                    closeOnConfirm: true,
                    closeOnCancel:true,
                    allowOutsideClick: false,
                    allowEscapeKey:true
                };

        swal(options, function(){
           console.log("inside cancel-request confirmation swal...");
           Meteor.call('cancelFriendRequest', tpl.data.user);
         });

    }
});

Meteor.methods({
  sendFriendRequest: function (recipient) {
    console.log('Inside sendFriendRequest...');
    ...
  },

  cancelFriendRequest: function (recipient) {
    console.log('Inside cancelFriendRequest ...');
    ....
  }
});

当我第一次点击“添加 friend ”按钮时，效果很好。我收到甜蜜的警报，确认后，我的回调正确完成，按钮变为“待处理/取消”按钮。

当我点击这个“待处理/取消”按钮取消我的好友请求时，我收到了正确的甜蜜警报，但是当我确认时，它会为第一个按钮“添加好友”执行回调“sendFriendRequest”。

我不明白为什么它会这样......对这个问题有什么想法吗？提前致谢。

更新:添加日志后

首次点击:添加好友:

客户端日志:

在里面点击.add-friend...

内部添加好友确认信息...

服务器日志:

sendFriendRequest 内部...

第二次点击:取消待处理的请求:

客户端日志

内部点击.cancel-request

内部添加好友确认信息...

服务器日志:

sendFriendRequest 内部...

Answer 1

只需在 swal 配置中设置 closeOnConfirm: false 即可。