React中Redux状态过滤异常：waitingItem未赋值问题求助

你遇到的问题核心是在更新waitingItem时误用了旧的cartList状态，而非刚从后端获取到的最新数据。

问题根源 #

在处理GET_CART_SUCCESS的reducer逻辑里，你虽然给cartList赋值了新的后端数据，但紧接着计算waitingItem时，用的是state.cartList——这个state.cartList是reducer更新前的旧状态（初始为空数组或之前的旧列表），并不是刚赋值的新数据。相当于你在空数组上执行过滤操作，自然得不到预期的结果，甚至会让waitingItem保持空数组状态，看起来像是没被赋值。

修复后的代码 #

只需要把过滤操作的数据源换成刚获取到的最新购物车列表即可：

case actionTypes.GET_CART_SUCCESS:
  // 先提取新的购物车列表，方便后续复用
  const newCartList = action.payload._embedded.cartResourceList;
  return {
    ...state,
    cartList: newCartList,
    page: action.payload.page,
    // 基于新的列表进行过滤，而非旧的state.cartList
    waitingItem: newCartList.filter(item => item.teamWith === 0 && item.priceType === "TEAM"),
    fetched: true,
    isFetching: false
  };

补充说明 #

Redux的reducer是纯函数，它的返回值是基于当前state和action生成的全新状态对象。在你原代码中，新的cartList仅存在于返回的新对象里，并没有修改当前的state，所以state.cartList还是更新前的旧值。必须直接使用后端返回的最新数据来计算waitingItem，才能得到正确的结果。

内容的提问来源于stack exchange，提问作者aditya kumar