ReactJS данные выборки не отображаются - PullRequest
Новая
       3

ReactJS данные выборки не отображаются

0 голосов
/ 06 мая 2020

Я пытаюсь получить список пользователей из AWS с помощью redux. На моем локальном хосте все работает нормально, но когда я помещаю приложение на сервер, я не вижу пользователей на странице, я вижу их только на консоли. Если я попытаюсь обновить sh страницу, я получу ошибку 404. Может кто-нибудь объяснить мне, что происходит? Что я делаю не так?

enter image description here

В моем компоненте я делаю это сначала 

componentDidMount = async () => {
  await this.props.GET_USERS()
}

Вот мое действие 

export const GET_USERS = () => async dispatch => {
  var params = {
    UserPoolId: 'POOL_ID'
  }

  try {
    const response = await new AWS.CognitoIdentityServiceProvider().listUsers(params).promise()
    dispatch({ type: 'GET_USERS_SUCCESS', response: response.Users })
  } catch(err) {
    dispatch({ type: 'GET_USERS_ERROR', response: err })
  }
}

Вот мой редуктор 

const usersReducer = (state = initState, action) => {
  switch(action.type) {
    case 'GET_USERS_SUCCESS':
      return { ...state, users: action.response }
    case 'GET_USERS_ERROR':
      return { ...state, users: action }
    default:
      return state
  }
}

А вот код, в котором я отображаю пользователей 

{
  this.props.users ? 
    this.props.users.length ?
      <table>
        <thead>
          <tr>
            <th>Email</th>
            <th>Name</th>
            <th>Date Created</th>
          </tr>
        </thead>
        <tbody>
          {
            this.props.users.map(el => (
              <tr key={ el.Attributes.find(attr => attr.Name === 'sub').Value }>
                <td>{ el.Attributes.find(attr => attr.Name === 'email').Value }</td>
                <td>{ el.Attributes.find(attr => attr.Name === 'given_name').Value }</td>
                <td>{ moment(el.UserCreateDate.toString()).format('MMMM Do YYYY hh:mm a') }</td>
              </tr>
            ))
          }
        </tbody>
      </table>
    :
      <p className="empty">No users found!</p>
  :
    <div className="loader"></div>
}
...