在 React.js 中没有从 saga 传递给减少的操作答案

【问题标题】：Actions not passing to the reducres from saga in React.js在 React.js 中没有从 saga 传递给减少的操作
【发布时间】：2021-05-18 03:20:19
【问题描述】：

当我登录到用户时，它有成功响应，但操作没有传递给减速器。但是在注册用户时，它工作正常。

//saga.js
import { put, takeEvery, all, call } from 'redux-saga/effects';
import {getRequest, postRequest} from '../../helpers/axiosClient';
import actions from "./actions";

function* registerUserAsync(params) {
    try {
        const response = yield call(() => postRequest('users/register', params.payload));
        yield put({
            type: actions.ON_REGISTER_SUCCESS,
            payload: response.data,
        });
    } catch (error) {
        yield put({
            type: actions.ON_REGISTER_FAILURE,
            payload: "Something Went Wrong",
        });
    }
}
function* loginUserAsync(params){
    try {
        const response = yield call(() => postRequest('users/login', params.payload));
        yield put({
            type: actions.ON_LOGIN_SUCCESS,
        })
        } catch (error) {
        yield put({
            type: actions.ON_LOGIN_FAILURE,
            payload:error.response.data.message
        })
        }}
function* forgetPasswordUser(params){
    try {
        const response = yield call(() => getRequest(`users/restorepassword/${params.payload}`));
        yield put({
                type: actions.ON_PASSWORD_RECOVERY_SUCCESS,
                payload: "PASSWORD RECOVER",
            });
        } catch (error) {
        }}
function* registerUser() {
    yield takeEvery('ON_REGISTER', registerUserAsync)
}
function* loginUser(){
    yield takeEvery('ON_LOGIN', loginUserAsync)
}
function* forgetPassword(){
    yield takeEvery('ON_FORGET_PASSWORD',forgetPasswordUser )
}
export default function* rootSaga() {
    yield all([
        registerUser(),
        loginUser(),
        forgetPassword()
    ])
}

actions.js

const actions={
    ON_REGISTER: "ON_REGISTER",
    ON_REGISTER_SUCCESS: "ON_REGISTER_SUCCESS",
    ON_REGISTER_FAILURE: "ON_REGISTER_FAILURE",
    ON_LOGIN: "ON_LOGIN",
    ON_LOGIN_SUCCESS: "ON_LOGIN_SUCCESS",
    ON_LOGIN_FAILURE: "ON_LOGIN_FAILURE",
    ON_PASSWORD_RECOVERY_SUCCESS: "ON_PASSWORD_RECOVERY_SUCCESS",
    ON_FORGET_PASSWORD:"ON_FORGET_PASSWORD",

}
export default actions;

reducer.js

import actions from "./actions";
const stateInit={
    registerUser: {
        first_name:"",
        last_name: "",
        email: "",
        password:"",
        confirm_password:"",
    },
    loadRegister:false,
    signedUp:false,
    loginUser: {
      email: "",
      password: "",
    },

}
export default function auth(state=stateInit, action){
    switch (action.type){
        case actions.ON_REGISTER:{
            return {
                ...state,
                registerUser: action.payload,
                loadRegister: true
            }
        }
        case actions.ON_REGISTER_SUCCESS: {
            return {
                ...state,
                loginUser: action.payload,
                loadRegister: false,
                signedUp: true,
            }
        }
        case actions.ON_REGISTER_FAILURE:{
            alert(action.payload)
            return {
                ...state,
                loadRegister: false,
                signedUp :false,
            }
        }
        case action.ON_LOGIN :{
            alert("on login")
            return {
                ...state,
            }
        }
        case action.ON_LOGIN_SUCCESS:{
            alert("ogin suceess")
            return {
                ...state
            }
        }

        case action.ON_LOGIN_FAILURE :{
            return {
                ...state,
            }
        }
        case action.ON_FORGET_PASSWORD: {
            alert("FORGET password")
            return {
                ...state
            }
        }
        case action.ON_PASSWORD_RECOVERY_SUCCESS:{
            alert("password recovered")
        }
        default:{
            return {
                ...state
            }
        }
    }
}

这里有代码，我有。与注册相同的登录结构，但是当我有成功响应时，它会死掉，而不是去那个动作。

【问题讨论】：

乍一看似乎一切正常。你做了什么调试？我会添加类似redux-logger 的内容（或者只是在auth 减速器和loginUserAsync saga 中添加一些console.logs）并按照请求进行操作-网络调用是否成功？传奇叫什么？减速机是否得到动作？等等

标签： javascript reactjs react-redux redux-saga

【解决方案1】：

我认为您的 switch 语句中有一个小错字。所有动作及其类型都应该是actions.TYPE

对于登录的情况，你把 action.ON_LOGIN 而不是 actions.ON_LOGIN

【讨论】：