无法读取未定义的属性(读取“in”)，同时在globalSelectors中使用createEntityAdapter中的redux工具箱的simpleSelectors

Question

我正在学习Redux并使用createEntityAdapter作为一个简单的待办应用程序。问题是，每当我试图从全局选择器或/和todoAdapter的简单选择器访问todo时，都会出现错误。

我已经为此创建了一个CodeSandBox

这是我正在设置的todoReducer代码

const todosAdapter = createEntityAdapter({
  selectId: (todo) => todo._id,
});

const initialState = {
  fetching: true,
  error: null,
  addingNew: false,
};

const todosSlice = createSlice({
  name: 'todos',
  initialState: todosAdapter.getInitialState(initialState),
  reducers: {
    pushNewTodo: todosAdapter.addOne,
    addManyTodos: todosAdapter.addMany,
    removeTodo: todosAdapter.removeOne,
    editTodo: todosAdapter.updateOne,
  },
  extraReducers: { ... }
})

//* Errror in this line , 
export const globalTodosReducers = todosAdapter.getSelectors((st) => st.todos);
export const simpleTodosReducers = todosAdapter.getSelectors();

export const {
  addTodo,
  removeTodo,
  toggleTodo,
  editTodo,
  clearTodos
} = todosSlice.actions;
export default todosSlice.reducer;

当我想要使用simpleSelectors时，也会出现错误

// TodoApp.js
function TodoApp() {
  .
  .
  .
  // * Error in these lines
  // const todos = globalTodosReducers.selectAll();
  const todos = simpleTodosReducers.selectAll();


.
.
.

错误是

Cannot read properties of undefined (reading 'ids')

Answer 1

getSelectors返回的对象包含许多选择器函数。每个对象都需要传入包含要从中选择的数据的状态对象。你在这里有个正确的想法：

todosAdapter.getSelectors((st) => st.todos)

这告诉实体适配器访问传递给选择器函数的任何对象的todos属性，以便获得由适配器管理的数据。

调用选择器时，传入应用程序的根状态：

const todos = globalTodosReducers.selectAll(store.getState());

在React的上下文中，react redux的useSelector函数将为您完成以下操作：

const todos = useSelector(globalTodosReducers.selectAll);