Блог

Я работаю над ngrx в версии angular 10
В Reducer, хотел добавить действие, которое удалит пользователя
, пока я пробовал приведенный ниже код, но с ним возникла проблема:
ОШИБКА TypeError: не удается удалить свойство ‘1’ из [массива объектов]
Не понимая этого поведения, поскольку я только что попытался удалить элемент из массива по его позиции
Я отлаживал и видел, что он получает индекс определенного объекта в массиве
, получая ошибку с state.users.splice(indx, 1);

 export interface State {
  users: IProduct[],
  error: string
}

export const initialState: State = {
  users: [],
  error: ''
};

export function reducer(state = initialState, action: UserActions): State {
  switch (action.type) {

    case UserActionTypes.DeleteUser:
      const indx = state.users.findIndex(user => user.id === action.payload.data.id);
      state.users.splice(indx, 1);
      return {
        ...state
      }

    case UserActionTypes.LoadUsers:
      return {
        ...state
      }

    case UserActionTypes.LoadUsersSuccess:
      return {
        ...state,
        users: [...state.users, ...action.payload.data],
        error: ''
      }

    case UserActionTypes.LoadUsersFailure:
      return {
        ...state,
        users: [],
        error: action.payload.error
      }

    default:
      return state;
  }
}
  

Наконец я получил решение
Я присвоил данные в новой переменной newState, а затем удалил объект из этого

 case UserActionTypes.DeleteUser:
      const index  = state.users.findIndex(user => user.id === action.payload.data.id);
      let newState = [...state.users];
      newState.splice(index, 1);
      return {
        users: newState,
        error:''
}
  

Я просто изменил приведенный выше код в данном сценарии

 export interface State {
  users: IProduct[],
  error: string
}

export const initialState: State = {
  users: [],
  error: ''
};

export function reducer(state = initialState, action: UserActions): State {
  switch (action.type) {

    case UserActionTypes.DeleteUser:
      const index  = state.users.findIndex(user => user.id === action.payload.data.id);
      let newState = [...state.users];
      newState.splice(index, 1);
      return {
        users: newState,
        error:''
      }

    case UserActionTypes.LoadUsers:
      return {
        ...state
      }

    case UserActionTypes.LoadUsersSuccess:
      return {
        ...state,
        users: [...state.users, ...action.payload.data],
        error: ''
      }

    case UserActionTypes.LoadUsersFailure:
      return {
        ...state,
        users: [],
        error: action.payload.error
      }

    default:
      return state;
  }
}