Реагировать на собственный редукс после того, как состояние входа в систему не обновляется до рендера - PullRequest
Новая
       19

Реагировать на собственный редукс после того, как состояние входа в систему не обновляется до рендера

0 голосов
/ 10 февраля 2020

После входа в систему и перенаправления на компонент «Домашняя страница» я звоню: 

mapStateToProps = (state) => ({
    getUser: state.userReducer.getUser
});

И пытаюсь отобразить значение: 

render() {
    const {getUser: {userDetails}} = this.props;
    return(
      <View><Text>{userDetails.EmployeeID}</Text></View>
    )
}

USER Reducer 

import { combineReducers } from 'redux';

const getUser = (state = {}, action) => {

switch (action.type) {

  case "GET_USER_LOADING":
      return {
        isLoading: true,
        isError: false,
        isSuccess: false,
        userDetails: null,
        errors: null
      }

  case "GET_USER_SUCCESS":
      return {
        isLoading: false,
        isError: false,
        isSuccess: true,
        userDetails: action.payload,
        errors: null
      }

  case "GET_USER_FAIL":
      return {
        isLoading: false,
        isError: true,
        isSuccess: false,
        userDetails: null,
        errors: action.payload
      }

  default:
    return state;
}

}

экспорт по умолчанию combReducers ({getUser});

и действие loginuser 

export const loginUser = (payload) => {
return async (dispatch) => {

    try {
      dispatch({
        type: "LOGIN_USER_LOADING"
      });
      const response = await fetchApi("front/authentication/login", "POST", payload, 200);

      if(response.responseBody.status) {
        dispatch({
            type: "LOGIN_USER_SUCCESS",
        });
        dispatch({
            type: "AUTH_USER_SUCCESS",
            token: response.token
        });
        dispatch({
            type: "GET_USER_SUCCESS",
            payload: response.responseBody.data
        });
        return response.responseBody.status;
      } else {
        throw response;
      }

    } catch (error) {
        dispatch({
            type: "LOGIN_USER_FAIL",
            payload: error.responseBody
        });
        return error;
    }
}

}

Но появляется сообщение об ошибке:

Ошибка типа: Undefined не является объектом (оценка 'userDetails.EmployeeID'

Если я удаляю userDetails.EmployeeID и перехожу на следующую страницу, а затем возвращаюсь, она показывает EmployeeID штраф.

Ответы [ 2 ]

0 голосов
/ 10 февраля 2020

Если ваше начальное состояние разрешается до чего-то «ложного» для userDetails, вы можете «дождаться» его значения: 

render() {
    const {getUser: {userDetails}} = this.props;
    return <View>
        <Text>{userDetails ? userDetails.EmployeeID : 'Loading'}</Text>
    </View>
}
0 голосов
/ 10 февраля 2020

Попробуйте следующим образом, 

render() {
const {getUser} = this.props;
return(
  <View><Text>{getUser.userDetails.EmployeeID}</Text></View>
)}

, если это не сработает, пожалуйста, напишите избыточный код

...