防止在Ionic中出现重复的Toast消息 [英] Prevent duplicate Toast messages in Ionic
问题描述
我已经在我的ionic2
项目中使用ToastController
实现了toast
.目前,我遇到重复的toast
消息问题.有什么方法可以防止ionic2/angular2中的Toast消息重复/重叠
I have implemented toast
using ToastController
in my ionic2
project . Currently i am facing an issue with the duplicate toast
messages . Is there any way to prevent the duplication / overlapping of toast message in ionic2 / angular2
(注意:重复表示当我单击一个按钮时,我正在显示一个祝酒词,如果我多次单击同一个按钮,则祝酒消息重叠了)?
(NB : Duplication means when I click on a button I am displaying a toast , if I click on the same button multiple times the toast messages overlaps ) ?
export class <className>{
constructor(private toast:ToastController){
}
showToast(message) {
let toast = this.toastCtrl.create({
message: message,
duration: 2000,
position: 'bottom'
})
toast.present();
}
}
我在单击按钮时调用此方法.
I am calling this method on an button click .
-
带有重复的烤面包(例如使用toastr的示例,对我来说是相同的情况)
with duplicates toast (taken example using toastr , same sitaution is for me)
当我启用阻止通知"时,重复的吐司不在超时时间内.
when i enable "prevent notification" , the duplicate toast are not there within the timeout duration .
非常感谢您的帮助.
推荐答案
您可以在该页面上使用属性,以在显示新的吐司之前知道是否在显示吐司.
You can use a property on that page to know if a toast is being shown or not before showing a new one.
import { ToastController, Toast } from 'ionic-angular';
// ...
private isToastVisible: boolean;
constructor(private toastCtrl: ToastController) { }
presentToast() {
if(this.isToastVisible) {
return;
}
this.isToastVisible = true;
const toast: Toast = this.toastCtrl.create({
message: 'User was added successfully',
duration: 3000,
position: 'top'
});
toast.onDidDismiss(() => {
this.isToastVisible = false;
});
toast.present();
}
离子4/5
import { ToastController } from '@ionic/angular';
// ...
private isToastVisible: boolean;
constructor(private toastCtrl: ToastController) { }
presentToast() {
if(this.isToastVisible) {
return;
}
this.isToastVisible = true;
this.toastCtrl.create({
message: 'User was added successfully',
duration: 3000,
position: 'top'
}).then((toast: HTMLIonToastElement) => {
toast.onDidDismiss().then(() => {
this.isToastVisible = false;
});
toast.present();
})
}
这篇关于防止在Ionic中出现重复的Toast消息的文章就介绍到这了,希望我们推荐的答案对大家有所帮助,也希望大家多多支持IT屋!