React/Firebase - 如何确保在重定向之前发生更新？

Question

在我的应用中，用户可以使用他们的电子邮件地址和密码（全部使用 Firebase）进行注册，默认情况下，如果用户使用电子邮件/密码注册，则不会设置他们的 displayName 和 photoURL。这就是为什么我试图通过添加这两个字段来在他们提交注册表单的那一刻更新他们的个人资料。

成功注册后，用户被重定向到我试图显示的受保护主页，您猜对了，他们的displayName 和照片 (photoURL) 但是，即使我设置了这些字段，主页没有按时显示，我总是必须刷新页面才能显示这些详细信息。

请问我可以帮忙吗？\

onSubmit = event => {
    const { displayName, photoURL, email, passwordOne } = this.state;
    const { history } = this.props; /* eslint-disable-line */

    authFunctions
        .doCreateUserWithEmailAndPassword(email, passwordOne)
        .then(session => {
            auth.currentUser.updateProfile({
                displayName,
                photoURL
            });
            db.doCreateUser(session.user.uid, displayName, photoURL, email)
                .then(() => {
                    this.setState({ ...INITIAL_STATE });
                    history.push(routes.HOME);
                })
                .catch(error => {
                    this.setState(byPropKey('error', error));
                });
        })
        .catch(error => {
            this.setState(byPropKey('error', error));
        });

    event.preventDefault();
};

正如您在我的代码中看到的那样，我正在 Firebase 上创建用户，然后也将它们添加到数据库中。我正在尝试在创建实际用户后立即更新配置文件，但由于某种原因它没有选择它。

Answer 1

您正在更新 Firebase 用户配置文件并同时在数据库中创建用户配置文件。它很可能会在更新完成之前路由到主屏幕。

return auth.currentUser.updateProfile({ displayName, photoURL }).then(() => {
    db.doCreateUser(session.user.uid, displayName, photoURL, email).then(() => {
        this.setState({ ...INITIAL_STATE });
        history.push(routes.HOME);
    })
})

在更新 Firebase 用户后添加一个 then 并在数据库中创建用户配置文件。