React Redux购物车添加商品时localStorage不存储、state不更新问题求助

问题原因 #

核心错误出在cartReducer.js的逻辑中：
Redux reducer 是通过匹配action.type字段来执行对应状态更新逻辑的，你当前代码的switch语句错误判断了action.state字段，而action对象上根本不存在这个属性，因此所有action都会直接走default分支，直接返回原始state，不会执行任何更新操作，也就自然出现了action触发成功但state无变化的问题，后续存储localStorage时读取的还是未更新的旧state，因此也无法持久化新加入的商品。

修复方案 #

仅需修改cartReducer.js中的switch判断条件即可：
将原来的

switch (action.state) {

修改为

switch (action.type) {

修改完成后完整的cartReducer.js参考代码：

import { CART_ADD_ITEM, CART_REMOVE_ITEM } from "../constants/cartConstants";

export const cartReducer = (state = { cartItems: [] }, action) => {
  switch (action.type) {
    case CART_ADD_ITEM:
      const item = action.payload;
      const existItem = state.cartItems.find(
        (x) => x.productID === item.productID
      );

      if (existItem) {
        return {
          ...state,
          cartItems: state.cartItems.map((x) =>
            x.productID === existItem.productID ? item : x
          ),
        };
      } else {
        return {
          ...state,
          cartItems: [...state.cartItems, item],
        };
      }
    case CART_REMOVE_ITEM:
      return {
        ...state,
        cartItems: state.cartItems.filter(x => x.productID !== action.payload)
      }
    default:
      return state;
  }
};

修改完成后，reducer就能正确匹配到CART_ADD_ITEM类型的action，执行对应的购物车商品添加逻辑，state更新后，后续的localStorage存储也会正常生效。

内容的提问来源于stack exchange，提问作者Ankush Dogra