首页 > 解决方案 > React 调度不起作用(userService 函数未在 userAction 中触发)

问题描述

当我提交表单时,它会触发一个操作登录(来自userActions)。在这个动作中,我使用 dispatch 来使用 myuserService进行 API 调用。当我提交它时,调度不起作用。如果我 console.log 操作的结果,我的代码会出现,如下所示:

Action was called    // Custom message
dispatch => {
    dispatch(request({
      email
    }))

    _services_userService__WEBPACK_IMPORTED_MODULE_1__["userService"].login(email, password).then( appSate => {return appSate;},error => {console.lo…

我应该检索我的用户...这里有什么问题?

登录表单.js

handleFormSubmit(e) {
    e.preventDefault();
    const credentials = {
        email: this.state.email,
        password: this.state.password
    }
    if (credentials) {
        let test = login(credentials);
        console.log("Action was called");
        console.log(test);
        this.setState(redirect => true)
    }
}

userActions.js -> 登录()

export const login = (email,password) => {
    console.log('is in action');
    return dispatch => {
        dispatch(request({ email }));
        userService.login(email,password)
            .then(
                appSate => {
                    return appSate;
                },
                error => {
                    console.log(error);
                }
            );
    };
    function request(user) { return { type: userConstants.LOGIN_REQUEST,user } }
}

userService.js -> 登录()

function login(credentials) {
    console.log("In userService login function");
    return axios.post('/api/login',credentials)
        .then(response => {
            if (response.data.success) {
                console.log("Login Successful!");

                let userData = {
                    firstname: response.data.user.firstname,
                    surname: response.data.user.surname,
                    id: response.data.user.id,
                    email: response.data.user.email,
                    auth_token: response.data.access_token,
                };
                let appState = {
                    isLoggedIn: true,
                    user: userData
                };
                localStorage.setItem("appState",JSON.stringify(appState));
                return appState;
            }
        });
}

标签: reactjsreact-redux

解决方案


我想你忘记了返回语句 userActions.js。尝试这个

export const login = (email,password) => {
console.log('is in action');
return dispatch => {
    dispatch(request({ email }));
    return userService.login(email,password)
        .then(
            appSate => {
                return appSate;
            },
            error => {
                console.log(error);
            }
        );
};
function request(user) { return { type: userConstants.LOGIN_REQUEST,user } }

}


推荐阅读