Documentation
Feedback
Guides

useCartItem hook

This feature is only available for stores using B2B Buyer Portal, which is currently available to selected accounts.

The useCartItem hook allows you to access detailed information about an individual cart item. This is particularly useful when you need to retrieve or display specific data related to a single item in the cart.

This hook is only available in some extension points.

Usage


_14
import { useCartItem } from '@vtex/checkout';
_14
_14
const CartItemDetails = () => {
_14
const cartItem = useCartItem();
_14
_14
return (
_14
<div>
_14
<p>Product: {cartItem.id}</p>
_14
<p>Quantity: {cartItem.quantity}</p>
_14
<p>Price: {cartItem.price}</p>
_14
<img src={cartItem.imageUrl} alt="Product image" />
_14
</div>
_14
);
_14
};

Parameters

The useCartItem hook does not accept any parameters.

Returns

The useCartItem returns a CartItem object for the current cart item context.

Extension Points

This hook is available in the following extension points:

  • cart.cart-item.after
  • punchout.cart-item.after
  • delivery.cart-item.after
  • review.cart-item.after
  • payment.cart-item.after
  • order-placed.cart-item.after
Contributors
2
Photo of the contributor
Photo of the contributor
Was this helpful?
Yes
No
Suggest Edits (GitHub)
Contributors
2
Photo of the contributor
Photo of the contributor
Was this helpful?
Suggest edits (GitHub)
On this page