在vue.js应用程序中放置Firestore分离监听器方法的位置

Question

我正在开发一个vue应用程序，我在其中设置了几个Firestore侦听器。我想在用户关闭浏览器选项卡或从我的应用中导航离开时分离这些Firestore侦听器。

我在beforeUnmount生命周期事件中调用分离方法。但是在浏览器窗口关闭之前，我无法判断分离方法是否完成。

所以，我的问题是在一个vue js应用程序中分离Firestore监听器的最佳实践是什么?

Answer 1

使用beforeunload浏览器事件

created () {    
window.addEventListener('beforeunload', this.detachFireStoreListener)  
},
methods: {
detachFireStoreListener () {
//detach FirestoreListenern here
}
}

Answer 2

以上是旧版本…这是更新后的

window.addEventListener('beforeunload', (event) => {
// Cancel the event as stated by the standard.
event.preventDefault();
// Chrome requires returnValue to be set.
event.returnValue = '';
});