Массив становится неопределенным - React Redux

Вы возвращаете неправильную форму состояния в своем редукторе. Ваш связанный код:

export default function(state = initialState, action) { 
    switch (action.type) {
        case GET_USERS:
            return [
                ...state
            ];
        default:
            return state;
    }
}

Здесь состояние — это объект, но вы возвращаете его в массиве, распространяя его. Итак, ваше состояние нарушено.

Попробуйте так:

case GET_USERS:
    return state;

Как указал в своем ответе @Idan Dagan, на самом деле мы не изменяем состояние в наших редюсерах. Я просто дал это предложение, поскольку вы просто играете, чтобы изучить Redux, и здесь мы возвращаем исходное состояние, не более того. Но это подходящий и лучший способ вернуть состояние:

case GET_USERS:
    return { ...state };

Вот рабочий код: https://codesandbox.io/s/k5ymxwknpv

Я также снова изменил forEach на map, как предложил @Idan Dagan. Я этого не понимал. forEach здесь не подходит, так как на самом деле он ничего не возвращает. Вы хотите сопоставить свои массивы в React и визуализировать их.

Кроме того, ваше название штата сбивает с толку :) user.users немного странно, вы можете придумать что-то получше.

Редактировать после комментариев

Ваше действие GET_USERS на самом деле выполняется, но вы неправильно проверяете его в своем коде. Ты делаешь:

export default function(state = initialState, action) {
  switch (action.type) {
    case GET_USERS:
      return Object.assign({}, state);
    default:
      return {
        users: [
          { id: 1, name: "TEST" },
          { id: 2, name: "TEST1" },
          { id: 3, name: "TEST2" }
        ]
      };
  }
}

Что здесь происходит? Первое действие Redux — INIT. Это инициализация вашего состояния. Теперь, поскольку нет определенного действия, ваш редуктор попадает в случай по умолчанию и возвращает TEST. Теперь ваше состояние становится данными TEST. Затем ваш GET_USERS попадает, и вы возвращаете новый объект, который объединяет состояние, которое является TEST. Вот шаги:

First, state is the `initialState` -> `INIT` runs and hits the default case
State is now TEST one -> GET_USERS hit and returns the `state` which is TEST one
You see the TEST one.

Как проверить свои действия? Просто поместите console.log в свой редуктор:

export default function(state = initialState, action) {
  console.log("state",state);
  console.log("action",action);
  .....

и увидеть, что GET_USERS на самом деле попал. Другой вариант — вместо того, чтобы возвращать объединенный объект с помощью state, попробуйте объединить его с initialState или с помощью оператора распространения вернуть новый объект, используя initialState:

return return Object.assign({}, initialState);

or

return {...initialState}

Последний вариант дает вам немного больше понимания того, как работает мое первое объяснение. Попробуйте вернуть это для вашего GET_USERS:

return {...state, users:[...state.users, {id:4, name: "foo"}]};

Вы увидите список пользователей с данными TEST, но последним будет ваш foo. Это объясняет, как вы теряете initialState, если возвращаете что-то помимо state в случае по умолчанию.

Последнее предложение: вы можете отлаживать свою разработку Redux с помощью инструментов разработки Redux. Это отличный инструмент, который делает гораздо больше, чем отладка. Вы можете легко отслеживать все свои операции для Redux.

Я не уверен, что вы пытаетесь сделать с новым состоянием.

Но есть пара изменений, которые вам нужно сделать:

1. Используйте map вместо forEach (потому что вы хотите вернуть новый массив).
2. В редукторе вы можете вернуть состояние следующим образом:

export default function(state = initialState, action) { 
    switch (action.type) {
        case GET_USERS:
            return Object.assign({}, state);
        default:
            return state;
    }
}

как упоминается в документах redux:

Мы не изменяем состояние. Создаем копию с Object.assign().