删除Typescript的事件侦听器不起作用
我试着从'@ionic native/SMS'导入{SMS}代码>在我的ionic 3聊天应用程序中。但是删除Typescript的事件侦听器不起作用,typescript,ionic3,cordova-plugins,event-listener,ionic-native,Typescript,Ionic3,Cordova Plugins,Event Listener,Ionic Native,我试着从'@ionic native/SMS'导入{SMS}在我的ionic 3聊天应用程序中。但是document.removeEventListener('onSMSArrive')不工作 以下是我正在使用的软件包 "@ionic-native/sms": "^4.3.0", "@ionic-native/core": "^4.3.0", "cordova-sms-plugin": "^0.1.11", 问题是,当我第一次进入我的页面时,它工作正常,当我收到手机短信时收到信息但是如果我返回
document.removeEventListener('onSMSArrive')代码>不工作
以下是我正在使用的软件包
"@ionic-native/sms": "^4.3.0",
"@ionic-native/core": "^4.3.0",
"cordova-sms-plugin": "^0.1.11",
问题是,当我第一次进入我的页面时,它工作正常,当我收到手机短信时收到信息但是如果我返回到另一个页面并返回到该页面,我会在函数中收到两次相同的消息。我认为事件侦听器没有删除,当我再次导航到该页面时,另一个侦听器正在添加到文档中
这是我的密码
我在页面加载时添加事件侦听器,在页面卸载时删除它
public ionViewWillEnter() {
this.smsService.startMessageListner();
}
public ionViewWillLeave() {
this.smsService.stopMessageListner();
}
以下是我的服务中的startMessageListner()
和stopMessageListner()
函数
public startMessageListner()
{
--- some works do here ---
this.startListner();
}
public startListner()
{
this.recieveMessage().then((message) => {
--- receives message here and when after
navigating multiple times I receives
multiple same messages here---
}
}
public recieveMessage() {
if (!window.SMS) { alert('SMS plugin not ready'); return; }
window.SMS.startWatch(function() {
console.log('Watching');
}, function() {
console.log('Not Watching');
});
this.promise = new Promise((resolve, reject) => {
document.addEventListener('onSMSArrive', this.resolveMessage(resolve));
});
return this.promise;
}
public stopMessageListner()
{
--- some works do here ---
this.stopReciveMessage();
}
public stopReciveMessage()
{
// ***This one also not works***
// document.removeEventListener('onSMSArrive', (event)=>{
// window.SMS.stopWatch(function() {
// console.log('Stop Watching');
// }, function() {
// console.log('Not Stop Watching');
// });
// });
document.removeEventListener('onSMSArrive');
window.SMS.stopWatch(function() {
console.log('Stop Watching');
}, function() {
console.log('Not Stop Watching');
});
}
请帮我解决这个问题。这个问题浪费了我整整一周的时间。还是没有运气:(
==更新评论===
所有给定的链接都表示,在删除事件侦听器时,我必须传递完全相同的函数。在我的情况下,我在调用document.addEventListener
时,使用resolve
参数传递this.resolveMessage(resolve)
。因此我已经按如下方式尝试了它,但仍然没有解决
二,。
对于1中相同的receiveMessage()
public stopReciveMessage()
{
document.removeEventListener('onSMSArrive', this.resolveMessage,false);
window.SMS.stopWatch(function() {
console.log('Stop Watching');
}, function() {
console.log('Not Stop Watching');
});
}
public stopReciveMessage()
{
let self = this;
this.promise = new Promise((resolve, reject) => {
document.removeEventListener('onSMSArrive', self.resolveMessage(resolve),false);
window.SMS.stopWatch(function() {
console.log('Stop Watching');
}, function() {
console.log('Not Stop Watching');
});
});
}
public stopReciveMessage()
{
let self = this;
this.promise = (resolve, reject) => {
document.removeEventListener('onSMSArrive', self.resolveMessage(resolve),false);
window.SMS.stopWatch(function() {
console.log('Stop Watching');
}, function() {
console.log('Not Stop Watching');
});
};
}
三,。
对于1中相同的receiveMessage()
public stopReciveMessage()
{
document.removeEventListener('onSMSArrive', this.resolveMessage,false);
window.SMS.stopWatch(function() {
console.log('Stop Watching');
}, function() {
console.log('Not Stop Watching');
});
}
public stopReciveMessage()
{
let self = this;
this.promise = new Promise((resolve, reject) => {
document.removeEventListener('onSMSArrive', self.resolveMessage(resolve),false);
window.SMS.stopWatch(function() {
console.log('Stop Watching');
}, function() {
console.log('Not Stop Watching');
});
});
}
public stopReciveMessage()
{
let self = this;
this.promise = (resolve, reject) => {
document.removeEventListener('onSMSArrive', self.resolveMessage(resolve),false);
window.SMS.stopWatch(function() {
console.log('Stop Watching');
}, function() {
console.log('Not Stop Watching');
});
};
}
四,。
对于1中相同的receiveMessage()
public stopReciveMessage()
{
document.removeEventListener('onSMSArrive', this.resolveMessage,false);
window.SMS.stopWatch(function() {
console.log('Stop Watching');
}, function() {
console.log('Not Stop Watching');
});
}
public stopReciveMessage()
{
let self = this;
this.promise = new Promise((resolve, reject) => {
document.removeEventListener('onSMSArrive', self.resolveMessage(resolve),false);
window.SMS.stopWatch(function() {
console.log('Stop Watching');
}, function() {
console.log('Not Stop Watching');
});
});
}
public stopReciveMessage()
{
let self = this;
this.promise = (resolve, reject) => {
document.removeEventListener('onSMSArrive', self.resolveMessage(resolve),false);
window.SMS.stopWatch(function() {
console.log('Stop Watching');
}, function() {
console.log('Not Stop Watching');
});
};
}
谢谢我同意在typescript中删除事件侦听器是一件非常痛苦的事情。我在Vue中解决了这个问题,如下所示:
class App {
mylistener:EventListener
created(){
this.mylistener = (e:Event) => this.logMessage(e,"hello")
window.addEventListener('click', this.mylistener);
}
destroyed(){
window.removeEventListener("click", this.mylistener)
}
logMessage(e:Event, str:String){
console.log("click event was called")
}
}
这假定“已创建”和“已销毁”创建和删除组件时会调用函数。首先检查是否可以使用基本示例,如果可以,请查看如何将其应用于SMS库-该库可能有自己的问题。在哪里调用方法stopReceiveMessage
?尝试使用此方法。承诺。取消订阅();
发送消息后立即发送。感谢您的评论,我在stopMessageListner()内调用StopReceiveMessage。无论如何,我会收到以下错误:“this.promise.unsubscribe不是函数”离开表单我的页面时。要删除EventListener,您必须传递与通过addEventListener
传递的函数完全相同的函数,而不是具有相同内容的其他函数。其他可能目标的可能重复: