如何从商店中获取数组？答案

【问题标题】：How to take an array from store?如何从商店中获取数组？
【发布时间】：2022-11-25 02:49:51
【问题描述】：

我有一个应用程序可以将产品添加到购物车。我通过 Redux Toolkit 实现应用程序。当我单击“添加到购物车”按钮时，有关该产品的所有信息都应显示在购物车中。

现在的问题是添加的商品没有进入数组。每次都会向控制台输出一个空数组。你怎么能这样？

import { createSlice } from "@reduxjs/toolkit";

const initialState = {
  productsArr: {
    items: [],
  },
};

const cartSlice = createSlice({
  name: "cart",
  initialState,
  reducers: {
    addItemToCart: (state, action) => {
      state.productArr.items.concat([
        {
          id: action.payload.productId,
          title: action.payload.productTitle,
        },
      ]);
      state.productArr.totalQuantity += 1;
    },
  },
});

// these exports should stay the way they are
export const { addItemToCart} = cartSlice.actions;

export default cartSlice.reducer;

const ProductItem = (props) => {
  const { title, price, description, id } = props;
  const productTitle = title;
  const productId = id;
  const dispatch = useDispatch();
  const addToCartHandler = () => {
    console.log(addItemToCart({ productId, productTitle }));
    dispatch(addItemToCart({ productId, productTitle }));
  };

  return (
    <li className={classes.item}>
      <Card>
        <header>
          <h3>{title}</h3>
          <div className={classes.price}>${price.toFixed(2)}</div>
        </header>
        <p>{description}</p>
        <div className={classes.actions}>
          <button onClick={addToCartHandler}>Add to Cart</button>
        </div>
      </Card>
    </li>
  );
};

const Cart = (props) => {
  const cartItems = useSelector((state) => state.cart.productArr.items);
  console.log(cartItems);

  return(
    <Card className={classes.cart}>
      <h2>Your Shopping Cart</h2>
      <ul>
        {cartItems.map((cartItem) => (
          <CartItem
            item={{
              title: cartItem.title,
              // quantity: item.quantity,
              // total: item.totalPrice,
              // price: item.price,
              key: cartItem.id,
            }}
          />
        ))}
      </ul>
    </Card>
  )
};

【问题讨论】：

标签： reactjs react-redux redux-toolkit

【解决方案1】：

我觉得应该是

    State.productArr.items.push(
{
      id: action.payload.productId,
      title: action.payload.productTitle,
});

你试过推法吗？？

【讨论】：