如何在状态中设置侦听器

Question

我有一个Firestore onSnapshot侦听器在侦听文档上的更改，但如果我将其设置为以下状态，我似乎无法理解它是如何工作的：

constructor(props) {
super(props);         
this.fetchChatsListener = null;
} 

我就是这样设置的：

this.fetchChatsListener = firestore().collection('chats').doc(documentSnapshot.id).collection('messages').where('created', '>=', currenttime);
this.state.sent_message_id != '' ? this.fetchChatsListener.where(firebase.firestore.FieldPath.documentId(), '!=', this.state.sent_message_id) : ''
this.fetchChatsListener.orderBy('created', 'desc')
.onSnapshot({
error: (e) => console.error(e),
next: (querySnapshot_) => {
querySnapshot_.docChanges().forEach(change => {
this.state.dataSource.push({
...change.doc.data(),
key: change.doc.id,
});
});
this.setState({
chatEntered: true,
dataSource: this.state.dataSource,
refreshingMessages: false,
current_chat_id: documentSnapshot.id
});
},
});

我调用此函数来取消订阅：

unsubscribe_chats_listener() {
this.fetchChatsListener;
this.fetchChatsListener = null;
}

但不幸的是，它并没有取消订阅，因为我不断收到新的更改。

更新

当我尝试使用取消订阅时

this.fetchChatsListener();

它失败了，并出现以下错误：

TypeError: this.fetchChatsListener is not a function

Answer 1

OP代码只提到了取消订阅功能，它需要调用它。

unsubscribe_chats_listener() {
this.fetchChatsListener();  // note the parens, causing invocation
this.fetchChatsListener = null;
}

编辑

this.fetchChatsListener正在初始化为查询。查询不是取消订阅函数。

this.fetchChatsListener = firestore().collection('chats') // a collection ref
.doc(documentSnapshot.id)  // a doc ref
.collection('messages')    // a collection ref
.where('created', '>=', currenttime);  // a query

onSnapshot()返回unsubscribe函数，所以在那里设置属性。。。

let query = firestore().collection('chats')
.doc(documentSnapshot.id)
.collection('messages')
.where('created', '>=', currenttime);
this.state.sent_message_id != '' ? query.fetchChatsListener.where(firebase.firestore.FieldPath.documentId(), '!=', this.state.sent_message_id) : ''

query.orderBy('created', 'desc')
this.fetchChatsListener = query.onSnapshot({  // an unsubscribe function
error: (e) => console.error(e),
next: (querySnapshot_) => {
// ...