1

当应用程序初始化一系列 API 调用以填充状态时，我有一个名为 AppContext 的应用程序商店设置。

我遇到的问题是，当尝试执行 .findIndex、.IndexOf 或任何后续函数等数组函数时，系统总是以 a-1或undefined.

我 100% 确定并测试了此操作期间数据是否存在。

初始状态的状态如下所示：

state: {
    users: [], 
    user: { uid: '' }
}

状态如下所示：

state:{
    users: {
        {uid: '123'},
        {uid: '456'}
    }
    user: {
        uid: '123'
        ... 
    }
}

API 返回的数据如下所示：

[{ uid: '123' }, {uid: '456'}]

我正在使用useReducer以下代码填充状态：

export const UsersReducer = (state: IUserType[], action: actions) => {
  switch (action.type) {
    case 'SET_USERS':
      return action.payload;
    default:
      return { ...state };
  }
};

这已加载到上下文存储中，如下所示：

users: UsersReducer(users, action),

并在异步数据库调用中使用如下：

dispatch({ type: 'SET_USERS', payload: result.data.data });

状态的类型如下：

export type IUserType = {
  uid: string;
}

有效载荷的类型：

export type ActionMap<M extends { [index: string]: any }> = {
  [Key in keyof M]: M[Key] extends undefined ? { type: Key } : { type: Key; payload: M[Key] };
};

type UsersPayload = {
  [AppReducerTypes.SetUsers]: IUserType[];
};

export type UsersActions = ActionMap<UsersPayload>[keyof ActionMap<UsersPayload>];

为什么 React 将数组存储为状态中的对象？其次，为什么我不能对应该存储为数组的项目执行数组函数？

4

0 回答 0