Javascript 如何在Extjs中创建单例Toast

我需要在我的应用程序的屏幕上创建一个祝酒词，今天如果我在一个按钮上单击多次，就会出现几个祝酒词

编辑：

---

但是，如果用户快速单击按钮，土司会被创建多次

只需给它一个唯一的标识符，并在创建新的标识符之前检查它是否已经存在

{
xtype:'按钮'，
处理程序：函数（）{
if（！Ext.ComponentQuery.query（'#myToast'）.length）{
分机吐司({
itemId:'myToast'，
敬酒
});
}
}
}

---

只需给它一个唯一的标识符，并在创建新标识符之前检查它是否已经存在

{
xtype:'按钮'，
处理程序：函数（）{
if（！Ext.ComponentQuery.query（'#myToast'）.length）{
分机吐司({
itemId:'myToast'，
敬酒
});
}
}
}

---

需要更多的细节。发布一些代码，如果可能的话创建一个plunkr，谈论你已经尝试了什么，预期的行为是什么，等等。但是你到底想对其他祝酒词做什么（如果你想同时显示多个祝酒词）？只需忽略或删除以前的吐司并显示新吐司或…？我需要删除以前的吐司。请参阅编辑需要更多详细信息。发布一些代码，如果可能的话创建一个plunkr，谈论你已经尝试了什么，预期的行为是什么，等等。但是你到底想对其他祝酒词做什么（如果你想同时显示多个祝酒词）？只需忽略或删除以前的吐司并显示新吐司或…？我需要删除以前的吐司。见版本

showToast: function(message) {
    var openedToast = Ext.get(document.querySelector('[id^="toast-"]'));
    if (openedToast != null) {
        var toast = Ext.getCmp(openedToast.id);
        toast.close();
    }
    Ext.defer(function() {
        Ext.toast({
            html: message,
            align: 't'
        });
    }, 80);
}