Line Items
Mutations listed here are used to send requests to the Line Item API Routes part of the Store Cart API Routes.
The hooks listed have general examples on how to use them, but it's highly recommended to use the CartProvider provider and the useCart hook to manage your cart and access the current cart across your application.
Mutations
useCreateLineItem
This hook generates a Line Item with a given Product Variant and adds it to the Cart.
Example
import React from "react"
import { useCreateLineItem } from "medusa-react"
type Props = {
cartId: string
}
const Cart = ({ cartId }: Props) => {
const createLineItem = useCreateLineItem(cartId)
const handleAddItem = (
variantId: string,
quantity: number
) => {
createLineItem.mutate({
variant_id: variantId,
quantity,
}, {
onSuccess: ({ cart }) => {
console.log(cart.items)
}
})
}
// ...
}
export default Cart
Hook Parameters
cartId
stringRequiredThe cart's ID.
Mutation Function Parameters
The details of the line item to create.
Mutation Function Returned Data
The cart's details.
useUpdateLineItem
This hook updates a line item's data.
Example
import React from "react"
import { useUpdateLineItem } from "medusa-react"
type Props = {
cartId: string
}
const Cart = ({ cartId }: Props) => {
const updateLineItem = useUpdateLineItem(cartId)
const handleUpdateItem = (
lineItemId: string,
quantity: number
) => {
updateLineItem.mutate({
lineId: lineItemId,
quantity,
}, {
onSuccess: ({ cart }) => {
console.log(cart.items)
}
})
}
// ...
}
export default Cart
Hook Parameters
cartId
stringRequiredThe cart's ID.
Mutation Function Parameters
Mutation Function Returned Data
The cart's details.
useDeleteLineItem
This hook deletes a line item from a cart. The payment sessions will be updated and the totals will be recalculated.
Example
import React from "react"
import { useDeleteLineItem } from "medusa-react"
type Props = {
cartId: string
}
const Cart = ({ cartId }: Props) => {
const deleteLineItem = useDeleteLineItem(cartId)
const handleDeleteItem = (
lineItemId: string
) => {
deleteLineItem.mutate({
lineId: lineItemId,
}, {
onSuccess: ({ cart }) => {
console.log(cart.items)
}
})
}
// ...
}
export default Cart
Hook Parameters
cartId
stringRequiredThe cart's ID.
Mutation Function Parameters
lineId
stringRequiredThe line item's ID.
Mutation Function Returned Data
The cart's details.
Was this section helpful?