如何在Redux中访问另一个reducer的状态

Question

因此，我是React的新手，我正在尝试构建一个简单的购物应用程序。我也在使用Redux商店和Saga。我有两个减速器。

具有以下初始状态的productsReducer：

const initState = {
  products: [],
  loading: false
}

我正在通过products API调用将产品数据加载到get数组中。

我有另一个称为cartReducer的减速器，它具有以下初始状态，并且必须实现并“添加到购物车”操作：

const initState = {
  loading: false,
  cartItems: [],
  cartCount: 0
}

添加到购物车的代码是：

case 'ADD_TO_CART':
  let addedItem = state.products.find(product => product.id === action.id)
  // products array contained list of products
  let existed_item = state.cartItems.find(product => action.id === product.id)
  if (existed_item) {
    existed_item.quantity += 1
    return {
      ...state,
      cartItems: state.cartItems,
      cartCount: state.cartItems.length,
    }
  } else {
    let newItem = Object.assign({}, addedItem);
    newItem.quantity = 1;
    return {
      ...state,
      cartItems: [...state.cartItems, newItem],
      cartCount: state.cartItems.length,
    }
  }

我将两个减速器组合如下：

const rootReducer = combineReducers({
  cartReducer,
  productsReducer
})
export default rootReducer;

最初，我在一个地方同时执行了两个reducer的动作，因此可以在products函数中访问ADD_TO_CART数组。但是，既然我已将动作分成单独的化简器，我不知道如何从products内部的productsReducer访问cartsReducer数组。

有人可以帮忙吗？

Answer 1

reducers在redux中不应相互依赖。您可以将reducer想象为一个函数，它接收一个动作和一个现有状态，并从中产生一个新状态。这样，每次使用相同参数的调用总是会返回相同的结果。

当您在应用程序中对状态进行建模时，应以不重复实体为目标。在您的情况下，您要将产品添加到购物车，但是该产品已经存储在产品列表中。在两个地方都有产品会产生重复（如果以某种方式修改了产品会发生什么情况？您必须将其更改两次）。

相反，您可以将产品ID存储在购物车中，并在需要访问时使用selector组合状态的两个部分。