Question

我有一个函数“ listen_for_dishes”，它侦听称为“ dishes”的文档集合中的更改。我在组件的componentDidMount生命周期方法中具有该功能。

listen_for_dishes（）：

import { firebase } from '../firebase';
import store from '../store';

export function listen_for_dishes() {
    firebase.db.collection("dishes")
    .onSnapshot(function(querySnapshot) {
        if(!store.getState().dishesState.dishes.length){
            console.log('INITIAL FIRE FIRE')
            store.dispatch({ type: 'DISHES_SET' });
            return;
        }
        console.log('FIRE FIRE')
    });
}

我从其中调用listen_for_dishes的组件：

class LandingPage extends Component {
  constructor(props) {
    super(props);
  }

  componentDidMount(){

    listen_for_dishes();
  }

  render() {

    var dishes = this.props.dishes;

    console.log('users: ', dishes);

    return (
      //some stuff

每次重新渲染LandingPage组件时，都会调用listen_for_dishes并有一个初始快照。实际上，这对于第一个渲染效果很好，但是如果我访问另一个页面然后返回到着陆页面并且集合没有任何更改，我不希望它触发。我猜唯一的解决方案是将侦听功能移到其他地方，如果是这样，最好的地方在哪里？我希望在用户访问的整个过程中都启用监听功能。

Firestore监听功能无需更改即可触发

0 个答案: