Получение ошибки как «Недопустимая попытка распространить не повторяемый экземпляр» - состояние не обновляется

Question

Я пытаюсь обновить состояние на onClick, но получаю сообщение об ошибке:

Invalid attempt to spread non-iterable instance

Не в состоянии выяснить проблему. кто-нибудь поможет мне?

вот моя функция обновления:

import { UPDATE_NAME } from "./Actions/types";
const initialState = {
  name: "Arif"
};

const rootReducer = (state = initialState, action) => {
  switch (action.type) {
    case UPDATE_NAME:
      console.log("action.payload", action);
      return [...state, { name: action.payload }];
  }
  return state;
};

export default rootReducer;

Демонстрационная версия

Answer 1

вместо

return [... state, {name: action.payload}];

используйте это

return {... state, name: action.payload};

или

const payloadObj = {имя: action.payload}

return {... state, ... payloadObj};

Answer 2

Ваше начальное состояние - объект JSON.

Во время первого запуска оператора return [... state, {name: action.payload}]; Это будет работать следующим образом ... state => ... initialState => name: "Arif" Поскольку вы использовали его внутри массива, то это похоже на -> [name: "Arif", {name: action.payload}], что недопустимо.

Вы должны объявить свой initialState следующим образом

const initialState = [
  {
     name: "Arif"
  }
];