当我在产品页面上添加产品数量时,一切正常,它将我转移到购物车,其中显示了我选择的数量。
当我尝试更新购物车中的产品数量时,会抛出错误。
我的购物车屏幕代码:
function CartScreen(props) {
const cart = useSelector((state) => state.cart);
const { cartItems } = cart;
const productId = props.match.params.id;
const qty = props.location.search
? Number(props.location.search.split("=")[1])
: 1;
const dispatch = useDispatch();
const removeFromCartHandler = (productId) => {
dispatch(removeFromCart(productId));
};
useEffect(() => {
if (productId) {
dispatch(addToCart(productId, qty));
}
}, []);
return (
<div>
<Header />
<div className="cart">
<div className="cart-list">
<ul className="cart-list-container">
<li>
<h3>Shopping Cart</h3>
<div>Price</div>
</li>
{cartItems.length === 0 ? (
<div>Cart is empty</div>
) : (
cartItems.map((item) => (
<li>
<div className="cart-image">
<img src={item.image} alt="product" />
</div>
<div className="cart-name">
<div>
<Link to={"/product/" + item.product}>{item.name}</Link>
</div>
<div>
Qty:
<select
value={item.qty}
onChange={(e) =>
dispatch(addToCart(item.product, e.target.value))
}
>
{[...Array(item.countInStock).keys()].map((x) => (
<option key={x + 1} value={x + 1}>
{x + 1}
</option>
))}
</select>
<button
type="button"
className="button"
onClick={() => removeFromCartHandler(item.product)}
>
Delete
</button>
</div>
</div>
<div className="cart-price">${item.price}</div>
</li>
))
)}
</ul>
</div>
<div className="cart-action">
<h3>
Subtotal ( {cartItems.reduce((a, c) => a + c.qty, 0)} items) : ${" "}
{cartItems.reduce((a, c) => a + c.price * c.qty, 0)}
</h3>
<button
className="button primary full-width"
disabled={cartItems.length === 0}
>
Proceed to Checkout
</button>
</div>
</div>
</div>
);
}
我的购物车操作代码:
import axios from "axios";
import { CART_ADD_ITEM, CART_REMOVE_ITEM } from "../constants/cartConstants";
const addToCart = (productId, qty) => async (dispatch, getState) => {
try {
const { data } = await axios.get("/api/products/" + productId);
dispatch({
type: CART_ADD_ITEM,
payload: {
product: data._id,
name: data.name,
image: data.image,
price: data.price,
countInStock: data.countInStock,
qty,
},
});
} catch (error) {}
};
const removeFromCart = (productId) => (dispatch) => {
dispatch({ type: CART_REMOVE_ITEM, payload: productId });
};
export { addToCart, removeFromCart };
答案 0 :(得分:0)
在CartScreen组件中,ggplot(mydata) +
geom_histogram(aes(x = x, y = ave(..count.., group, FUN = cumsum),
fill = gender, group = gender),
colour = "gray70", breaks = 1:10) +
facet_grid(rows = "gender")
在控制台中显示什么?
只需使用cartItems
钩检查您的代码及其返回的内容即可。
它必须返回一个带有useSelector
键的对象,其值作为数组。
您甚至可以这样做以避免错误并定义默认值,并将返回对象的值也固定在cartitems
中。
useSelector