GetUIkIt 3 通知关闭事件？答案

【问题标题】：GetUIkIt 3 Notification Close event?GetUIkIt 3 通知关闭事件？
【发布时间】：2018-08-28 16:41:20
【问题描述】：

我需要知道 UIKit 通知何时关闭。

UIkit 通知插件 (https://getuikit.com/docs/notification) 提到它有一个关闭事件。是否可以将其用于以编程方式触发的实例？

例如

UIkit.notification({
    message: 'my-message!',
    status: 'primary',
    timeout: null
});
UIKit.o

我尝试将通知放在变量上，（如建议的https://getuikit.com/docs/javascript#programmatic-use，它甚至声明You'll receive the initialized component as return value - 但你没有）

let foo = UIkit.notification('message'); // foo is undefined

我试过链接 on 方法

UIkit.notification.on('close', function() { ... }); // on is undefined

但.on 方法是UIkit.util.on($el, event, fn) 的一部分，并且在以编程方式调用通知时没有$el。

我能想到的唯一其他方法是将突变观察者放在身体上并观察通知元素以改变状态，但这似乎有点矫枉过正。

【问题讨论】：

类似事件问题stackoverflow.com/questions/47093268/uikit-3-catch-events

标签： javascript getuikit

【解决方案1】：

你可以试试这个

UIkit.util.on(document, 'close', function() { alert('Notification closed'); });

看到这个Pen

【讨论】：

但是如何让它仅针对特定通知触发（假设同时触发多个通知）？
我不知道这是否/如何可能。 UIkit 3 中没有用于识别通知的选项或属性。
感谢您的回答。它给了我解决方案的想法。

【解决方案2】：

有点哈克，但以下似乎“工作”：

function notify(){
  var params = Array.prototype.slice.call(arguments);
  new_f = params.shift()
  foo = UIkit.notification.apply(this, params);
  return function(foo, new_f, old_f){
    foo.close = function(){new_f(); foo.close = old_f; old_f.apply(this, arguments); }
    return foo
  }(foo, new_f, foo.close);
}

notify(function(){alert('ok');}, 'message');

&lt;script src="https://cdnjs.cloudflare.com/ajax/libs/uikit/3.0.0-rc.9/js/uikit.js"&gt;&lt;/script&gt;

【讨论】：

这看起来比我最终得到的要好。使用库时有时需要 Hacky。链接函数让我想起了过去的身体加载链！
它是“Hacky”，因为它没有记录；）...因此，它可能会在 libray 更新时中断：/ 我同样需要关闭触发器，我看到了这个“关闭”属性.顺便说一句，如果您不执行foo.close = old_f 部分，则该事件会触发多次

【解决方案3】：

您可以存储通知的句柄...

warning_notification = UIkit.notification({message: 'Warning message...',
                                           status: 'warning', timeout: 1000});

... 并检查这是否是关闭事件的起源：

UIkit.util.on(document, 'close', function(evt) {
  if (evt.detail[0] === warning_notification) {
    alert('Warning notification closed');
  }
});

现在，您只会在该通知完全关闭时看到警报。

Check out this demo.

【讨论】：