I’m working on an App in which I’m adding some specified products to the cart. Everything works fine, but after I add those products I can only see the number of items in the cart icon, but is there a way to open the entire cart view? Or is there any trigger for that?
I don’t know if I understand correctly, the idea is when adding the products to the cart, open a minicart with the added products or update an HTML element with the number of products added?
Yes, I want to open the minicart when someone clicks this custom “Add To Cart” button that I made for this specific case. And I’m using VTEX IO.
But after exploring the VTEX Apps repo I found a way to achieve this.
Basically I used the push method from the usePixel hook, I did something like this:
import { useOrderItems } from 'vtex.order-items/OrderItems'
import { usePixel } from 'vtex.pixel-manager'
...
const { addItems } = useOrderItems()
const { push } = usePixel()
const items = [
{id: 1, quantity: 10, seller: 1},
... // and so on...
]
...
// After some logic I do this to add to the cart
addItems(items) // this only adds the items to the cart but doesn't open the minicart in the store
// and to automatically open the minicart window I use this
push({
id: 'add-to-cart-button',
event: 'viewCart',
})
I also found some examples that use only the push method to add the items like this: