React：componentWillUnMountでfirebase refを切断する

Question

ユーザーが単一のページアプリケーションでビューを変更したときにfirebase refを切断したいとします。私がフィルタリングされたデータだけを必要とし、各ビューが異なるデータをフィルタリングするので、上記のユーザがビューを変更すると、firebaseの新しいリファレンスを取得したいと思います。

ビューを変更して一部のデータを更新すると問題が発生します。次のエラー火災を反応：

Warning: setState(...): Can only update a mounted or mounting component. This usually means you called setState() on an unmounted component. This is a no-op.

がアンマウントコンポーネントを更新しようとして、このエラーは他のビューを参照。このはのため、が発生しないはずです。コンポーネントWillUnMountの参照を閉じる。両方のビューで

私は新しい参照を取得するための次のコードを持っている：

componentDidMount() { 
    // I have declared this.ref on the constructor so I can call off() on componentWillUnMount 
    this.ref = firebase.database().ref().child('mainNode').orderByChild('someProperty').equalTo('someValue'); 

    this.ref.on('value', (snap) => { 
     let values = []; 
     snap.forEach((child) => { 
     let value = child.val(); 
     let key = child.key; 
     const valueWithKey = update(value, {$merge: {key}}); 
     values.push(valueWithKey); 
     }); 
     // This is the offending line 
     this.setState({data: values}); 
    }); 
    } 

そして、ここでは私のcomponentWillUnMountコードは次のとおりです。私は間違っ

componentWillUnMount() { 
    this.ref.off(); 
    // I have also tried goOffline() 
} 

何をしているのですか？

Answer 1

正しいライフサイクルフックの名前はで、componentWillUnMountではなく、Reactがその機能を実行していないことが判明しました。