Почему действие не запускает службу реагирования и редукции? - PullRequest
0 голосов
/ 19 июня 2019

Проблема:

Я создал приложение реагирования, и там я создал действие входа в систему, подобное этому.

import { createAction } from "redux-actions";

// Types
export const LOGIN = "login/LOGIN";
export const LOGIN_FAILED = "login/LOGIN_FAILED";
export const LOGIN_SUCCESS = "login/LOGIN_SUCCESS";
debugger;
export default {
  doLogin: createAction(LOGIN),
  loginSuccess: createAction(LOGIN_SUCCESS),
  loginFailed: createAction(LOGIN_FAILED)
};

Это мой index.js действий.

import * as login from './login'


// Export module actions and types
export {
    login as loginTypes
}
export const loginActions = login.default

Это мой редуктор входа в систему.

import { loginTypes as types } from "../actions";
import { handleActions } from "redux-actions";

const initialState = {
  username: "",
  hasError: false,
  error: {},
  resp: { status: 0, message: "" },
  loggedIn: false
};

export default handleActions(
  {
    [types.LOGIN]: (state, { payload }) => ({
      ...state,
      username: payload.username,
      hasError: false,
      error: {}
    }),
    [types.LOGIN_SUCCESS]: (state, { payload }) => ({
      ...state,
      username: "",
      hasError: false,
      resp: payload,
      error: null,
      loggedIn: true
    })
  },
  initialState
);

Это мой index.js редукторов.

import { combineReducers } from "redux";
import LoginReducer from "./login";

const rootReducer = combineReducers({
  login: LoginReducer
});

export default rootReducer;

Это мой файл loginService.

import { createLogic } from "redux-logic";

import { loginTypes } from "../actions";
import { loginActions } from "../actions";

import * as API from "./HTTPClient";
import * as endPoints from "./EndPoints";
import jwtDecode from "jwt-decode";

export default [
  createLogic({
    type: loginTypes.LOGIN, // only apply this logic to this type
    latest: true, // only take latest
    debounce: 1000, // Wait 1 s before triggering another call

    process({ MockHTTPClient, getState, action }, dispatch, done) {
      let HTTPClient;

      if (MockHTTPClient) {
        HTTPClient = MockHTTPClient;
      } else {
        HTTPClient = API;
      }

      let loginRequestObject = {
        username: action.payload.username,
        pass: action.payload.pass
      };

      HTTPClient.Post(endPoints.LOGIN, loginRequestObject)
        .then(resp => resp.data)
        .then(data => {
          console.log(data);
          var decodedToken = jwtDecode(data.token);
          localStorage.setItem("jwt", data.token);
          var user = {
            userName: decodedToken.preferred_username,
            roleName: decodedToken.role,
            name: decodedToken.name
          };
          localStorage.setItem("user", JSON.stringify(user));
          localStorage.setItem("role", decodedToken.role);
          HTTPClient.setAuth(); // Set token for subsequent calls
          return data.token;
        })
        .then(token => dispatch(loginActions.loginSuccess(token)))
        .catch(err => {
          var errorMessage = "Invalid username or password.";

          console.error("Login Error ", err); // log since could be render err
          if (err && err.code === "ECONNABORTED") {
            errorMessage = "Please check your internet connection.";
          }

          dispatch(
            loginActions.loginFailed({ title: "Error!", message: errorMessage })
          );
        })
        .then(() => done()); // call done when finished dispatching
    }
  })
];

Вот как я вызываю действие входа в систему из компонента.

this.props.doLogin({
        username: this.state.username,
        password: this.state.password
      });

Но когда я смотрю в инструментах избыточности, он показывает только действие входа в систему.Но в любом месте ошибки нет.Я много пытался понять, что может быть причиной этой проблемы.Но я не смог этого сделать.Может ли кто-нибудь помочь мне решить эту проблему?Спасибо.

...