javascript - 使用 React Redux Redux-Thunk 进行 Firebase 身份验证

标签 javascript reactjs firebase react-router react-redux

我正在尝试在我的 React Redux 应用程序中使用 Firebase 进行身份验证。 我想在成功登录后将用户重定向到下一页,但在提交登录表单时收到错误

错误

Cannot read property 'then' of undefined

处理LoginForm中的提交功能

handleFormSubmit(event) {
    event.preventDefault();
    if (this.props.email !== '' && this.props.password !== '') {
      this.props.loginUser(this.props.email, this.props.password)
      .then(() => {
        this.context.router.push('/posts');
      });
    } else {
      console.log('empty');
    }
  }

Action 创建器

export function loginUser(email, password) {
  return (dispatch) => {
    dispatch({ type: LOGIN_USER });
    firebase.auth().signInWithEmailAndPassword(email, password)
      .then(user => loginUserSuccess(dispatch, user))
      .catch(() => {
        console.log('failed to sign in');
        return;
      });
  };
}


export function loginUserSuccess(dispatch, user) {
  dispatch({
    type: LOGIN_USER_SUCCESS,
    payload: user
  });
}

如果我从句柄提交功能中删除 then,身份验证会起作用,但我不知道如何将用户重定向到下一页?

最佳答案

我能够通过在调度中包含返回来解决该问题。我将更新后的代码放在这里以供将来的访问者使用。

export function loginUser(email, password) {
  return (dispatch) => {
    dispatch({ type: LOGIN_USER });
    return firebase.auth().signInWithEmailAndPassword(email, password)
      .then(user => loginUserSuccess(dispatch, user))
      .catch(() => {
        console.log('failed to sign in');
        return;
      });
  };
}

谢谢。

关于javascript - 使用 React Redux Redux-Thunk 进行 Firebase 身份验证,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/45337972/

相关文章:

javascript - 满足条件但未调用函数(基本 JavaScript)

javascript - 在 mvc JavaScript 中加载下拉更改选择的列

javascript - 防止 this.state 与 setState 一起使用

android - 在 Firebase 中启用持久性时实际上会发生什么?

ios - 找不到“folly/folly-config.h”文件

javascript - 表单 onSubmit 与 onClick

下拉菜单和文本区域的 Javascript 验证

reactjs - @shopify/react-i18n 中更改语言时如何重新渲染页面?

IOS全屏应用: why does toolbar appears when page changes?

javascript - Firebase 部署 - "Unable to Authorize"错误