错误TypeError：无法删除[对象数组]的属性'1'

问题描述

我正在使用angular 10版本的ngrx
在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,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;
  }
}