javascript - Firebase / ReactJS - 承诺没有按正确的顺序工作

Question

我是 React 初学者，我正在开发一个简单的 CMS 应用程序。我在以正确的顺序从 Firebase 接收数据时遇到问题。这是用于编辑现有帖子或添加新帖子的组件。当我打开编辑页面时，它会在 getUserData 之前启动 getPostData 函数（错误的方式 - 挂起设置为 true 并且没有任何显示），但是当我刷新编辑页面时一切正常。添加新帖子时也可以正常工作。我知道 Firebase 是异步工作的，但在我的情况下，我需要 getUserData 在 getPostData 之前接收信息。起初我有简单的回调函数，然后我使用了Firebase 博客中所说的 Promise ，但这也不起作用。我非常感谢您对此的帮助。

componentDidMount() {
this.getUserData();
}

getPostData = () => {

if (this.props.match.params.id) {

    return firebase.database()
        .ref('/posts/' + this.props.match.params.id)
        .once('value', (snapshot) => {

            const val = snapshot.val();

            this.setState({
                post: val ? val : this.state.post,
                postId: this.props.match.params.id,
                pending: false,
            });
        })
    }
};


getUserData = () => {
const user = firebase.auth().currentUser;

firebase.database().ref('users/' + user.uid).once('value')
    .then(snapshot => {
        this.setState({
            post: {
                username: snapshot.val().username,
                language: snapshot.val().defaultlang,
                uid: user.uid
                //other stuff
            },
            pending: this.props.match.params.id ? true : false
        });
    })
    .then(this.getPostData());
};

标签： javascriptreactjsfirebasefirebase-realtime-database