React + Redux: необработанное отклонение (TypeError): недопустимая попытка распространить не повторяемый экземпляр

Question

Итак, я пытаюсь реализовать действие, которое асинхронно переводит текущего пользователя в онлайн из моего Rails Backend, используя axios. Когда он успешно дает ответ: я получаю следующую ошибку:

Unhandled Rejection (TypeError): Invalid attempt to spread non-iterable instance

Вот как выглядит response.data:

user: {
id: 4,
first_name: Julien,
last_name: Corb,
is_subscribed: true
}

store.js:

import { createStore, applyMiddleware } from "redux";
import thunk from 'redux-thunk';
import rootReducer from "./reducers";

const store = createStore(
  rootReducer,
  applyMiddleware(thunk)
);

export default store;

actions.js

import { CREATE_USER, PROPAGATE_LOGIN, PROPAGATE_LOGOUT } from "./actionTypes";
import axios from 'axios';

export const getCurrentUser = () => {
  return dispatch => {
    axios.get("/users/get_current_user", {})
    .then(response => {
      if (response.data.user) {
        dispatch(propagateLogin(...response.data)); //the error occurs here
      } else {
         dispatch(propagateLogout());
       }
    });
  };
};

export const propagateLogin = (user) => ({
  type: PROPAGATE_LOGIN,
  payload: {
    user
  }
});

export const propagateLogout = () => ({
  type: PROPAGATE_LOGOUT,
  payload: { }
});

users.js редуктор:

import { CREATE_USER, PROPAGATE_LOGIN, PROPAGATE_LOGOUT } from "../actionTypes";

const initialState = {
  user: null
};

export default function(state = initialState, action) {
  switch (action.type) {
    case CREATE_USER: {

    }
    case PROPAGATE_LOGIN: {
      return {
        ...state,
        user: action.payload
      }
    }
    case PROPAGATE_LOGOUT: {
      return {
        ...state,
        user: null
      }
    }
    default:
      return state;
  }
}

Впервые я получаю эту ошибку, я чувствую, что что-то не так с установкой начального пользовательского состояния на null; но проблема может быть и в другом.

Answer 1

Кажется, вы нашли решение вашей конкретной проблемы, но вот объяснение ошибки:

В вашем примере вы пытаетесь распространить объект, используя синтаксис, предназначенный для повторяемых объектов. Правильный синтаксис для object spread - const clone = {...original} (или dispatch(propagateLogin({...response.data})); в случае OP), который по существу перебирает ключи исходного объекта и копирует пары ключ / значение оригинала в новый литерал объекта.

От MDN

Для вызовов функций: myFunction(...iterableObj);

Для литералов или строк массива: [...iterableObj, '4', 'five', 6];

Для литералов объекта (новое в ECMAScript 2018): let objClone = { ...obj };