пытается удалить все элементы и добавить входящие элементы из вложенного объекта redux - PullRequest
0 голосов
/ 09 мая 2020

У меня ниже редуктор и ниже начальное состояние. classinfo - это родительское состояние, которое имеет массив вложенных состояний студентов. с помощью приведенного ниже редуктора я планирую (заменить предыдущих студентов новыми студентами), чтобы удалить всех студентов из предыдущего состояния, добавить новых студентов из «action.data.students» и вернуть новое состояние. В первый раз, когда я добавляю учащихся, проблем не возникает. Когда я добавляю еще одного учащегося, я получаю сообщение об ошибке «Между отправками обнаружена мутация состояния», пожалуйста, дайте мне знать, где я делаю это неправильно.

classInfo[ { Id:"", students:[] }]

function sampleReducer(state = initialState.classInfo, action) {
  switch (action.type) {
    case types.ADD_CLASSROOMS:
      return [...state, ...action.data];
    case types.REMOVE_CLASSROOMS:
      return state.filter((class) => class.id !== action.data);
    case types.ADD_STUDENT_DETAILS:
      const stateObj = state.map((class, i) => {
        if (class.id === action.data.id) {
          return {
            ...class,
            students: {
              ...action.data.students,
            },
          };
        }
        return {
          ...class,
        };


      });
      return stateObj;

    default:
      return state;
  }
}

Ответы [ 2 ]

1 голос
/ 09 мая 2020

У вас все хорошо, do not to mutate the state просто означает, не изменяйте prevState, просто обновляйте состояние.

Основная ошибка заключается в том, что вы пытаетесь изменить состояние ученика, как раньше. Тип array, и пока вы его обновляете, вы сделали это как object, просто опечатка. используйте [] вместо {}

const state = {
  id: 1,
  students: [
    {first: 1},
    {second: 2},
    {third: 3}
  ]
}

const action = {
  data: {
    students: [
      {fourth: 4}
    ]
  }
}

const updatedStudents = {
  ...action.data.students
}

console.log(state);
console.log(updatedStudents);

Итак, в вашем случае ->

case types.ADD_STUDENT_DETAILS:
      const stateObj = state.map((class, i) => {
        if (class.id === action.data.id) {
          return {
            ...class,
            students: [
              ...action.data.students,
            ],
          };
        }
        return {
          ...class,
        };


      });
      return stateObj;
1 голос
/ 09 мая 2020

Вы выкладываете объект на students. Это массив. Поэтому используйте квадратные скобки и разложите массив студентов - students: [...action.data.students]

...
case types.ADD_STUDENT_DETAILS:
      const stateObj = state.map((class, i) => {
        if (class.id === action.data.id) {
          return {
            ...class,
            students: [ //<----use square brackets(as its an array)
              ...action.data.students
            ],
          };
        }
        return class;


      });
      return stateObj;
    ...
Добро пожаловать на сайт PullRequest, где вы можете задавать вопросы и получать ответы от других членов сообщества.
...