数据在动作接线中的某处丢失答案

【问题标题】：Data is lost somewhere in action wiring数据在动作接线中的某处丢失
【发布时间】：2018-06-23 02:53:09
【问题描述】：

我有一个简单的注册表单，其中包含电子邮件、密码和管理员代码字段。我正在将这些数据传递给我的动作创建者，并且在完成注册之前我让它通过三个动作。在那里的某个地方，它只是停止了。它不返回任何错误。这是我的代码。

export const checkAdminCode = ({ email, password, adminCode }, history) => {
  return (dispatch) => {
    dispatch({ type: CHECK_ADMIN_CODE });

    firebase.database().ref('/env/adminCode').once('value', (snapshot) => {
      if (snapshot.val() === adminCode) {
        return registerUser(email, password, history, dispatch);
      }

      return loginUserFail(dispatch);
    });
  };
};

const registerUser = (email, password, history, dispatch) => {
  return (dispatch) => {
    dispatch({ type: REGISTER_USER });

    firebase.auth().createUserWithEmailAndPassword(email, password)
      .then((user) => loginUserSuccess(dispatch, history, user))
      .catch((err) => loginUserFail(dispatch, err));      
  };
};

const loginUserSuccess = (dispatch, history, user) => {
  history.push('/admin/dashboard');
  dispatch({
    type: LOGIN_USER_SUCCESS,
    paylaod: user
  });
};

需要注意的几点：

if (snapshot.val() === adminCode) { 确实有效。
在添加管理员代码之前，我已将表单直接提交至registerUser，并且成功了。

我放置了一些console.logs 试图找出故障发生的确切位置。测试以下代码后：

const registerUser = (email, password, history, dispatch) => {
  console.log('test1');
  return (dispatch) => {
    console.log('test2');
    dispatch({ type: REGISTER_USER });

    firebase.auth().createUserWithEmailAndPassword(email, password)
      .then((user) => loginUserSuccess(dispatch, history, user))
      .catch((err) => loginUserFail(dispatch, err));      
  };
};

console.log('test1'); 有效，console.log('test2'); 无效。

再一次，它没有返回任何错误，所以我不知道如何描述正在发生的事情或搜索什么。

请帮忙。提前致谢。

【问题讨论】：

嗨！通常这种类型的错误在调试器的帮助下很容易解决，你可以在代码的所有关键点设置断点，看看流程是如何进行的..
另外，我对 thunk 不是很熟悉（更喜欢编写中间件），但是这行 return registerUser(email, password, history, dispatch); 不应该更像 dispatch({ type: 'REGISTER_USER, payload: { email, password, history } }) 吗？将调度视为动作创建者的论点似乎有点奇怪。另外，顺便说一句，没有必要将历史传递给动作创建者，因为调度路由器动作也是如此（react-redux-router），否则它们会变成聪明的动作创建者，我的意思是

标签： reactjs firebase redux firebase-authentication redux-async-actions

【解决方案1】：

registerUser是async redux action，你需要用dispatch来调用它。

您无需将dispatch 显式传递给调用函数。

redux 会隐式传递。

export const checkAdminCode = ({ email, password, adminCode }, history) => {
      return (dispatch) => {
        dispatch({ type: CHECK_ADMIN_CODE });

        firebase.database().ref('/env/adminCode').once('value', (snapshot) => {
          if (snapshot.val() === adminCode) {

            dispatch (registerUser(email, password, history));
            ^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^

          }

          return loginUserFail(dispatch);
        });
      };
    };

【讨论】：