【问题标题】:React-Native Firebase list refreshReact-Native Firebase 列表刷新
【发布时间】:2018-04-19 21:01:45
【问题描述】:

我对 React Native、redux 等还很陌生,所以我希望你能提供帮助。本质上,我有一个“时间表”,我希望它能够收听 Firebase 上的任何更新。如果有新帖子,它将添加新帖子。

在我的 home 组件中,我调用以下操作:

componentDidMount() {
   this.props.listFetched();
}

在我的操作中,我获取快照并“反向”排序并将“提要”发送到我的减速器。

export const listFetched = () => {
    return (dispatch) => {
    const feed = [];
    firebase.database().ref('/posts').orderByChild('timestamp').on('value', snapshot => {
        snapshot.forEach((listSnap) => {
            const list = listSnap.val()
            feed.push(list);
        });
        console.log("END FEED: " + JSON.stringify(feed));
        dispatch({ type: LIST_FETCHED, payload: feed });
    });
};
};

这将返回我通过的列表。如果我刷新设备,它会按预期显示所有内容,但是当我添加新内容时,我需要再次手动刷新才能显示。

renderItem({ item }) {
    return <ListItem listItem={item} />
  }

  render() {
    return (
      <FlatList
        data={this.props.list}
        renderItem={this.renderItem}
      />
    );

const mapStateToProps = state => {
    const list = _.map(state.list, (val, uid) => {
    return { ...val, uid };
  });
    return { list };
};

由于某种原因,如果我使用以下操作,它会自动刷新列表,而无需我手动执行。

export const listFetched = () => {
    return (dispatch) => {
        firebase.database().ref('/posts').orderByChild('timestamp')
            .on('value', snapshot => {
                dispatch({ type: LIST_FETCHED, payload: snapshot.val() });
            })
    };
};

任何帮助将不胜感激。 谢谢

【问题讨论】:

    标签: firebase react-native redux


    【解决方案1】:

    我会更担心第一个不会自动更新,因为您在 Firebase 提取中使用的是“on”而不是“once”,如果有的话,第二个动作做得很好,你调用它一次然后然后每当firebase自动更新时,“on”就会更新。如果您想控制它的更新时间,请使用“once”而不是“on”。

    【讨论】:

      猜你喜欢
      • 1970-01-01
      • 1970-01-01
      • 1970-01-01
      • 2018-09-05
      • 1970-01-01
      • 2020-01-04
      • 2017-02-20
      • 1970-01-01
      • 2016-04-06
      相关资源
      最近更新 更多