Skip to main content
Módulo Vuex responsável por todas as operações do carrinho. Comunica-se com a API do checkout Yampi e dispara eventos de pixels após cada operação.

​
Getters

GetterTipoDescrição
cartObjectObjeto completo do carrinho, retornado pela API do checkout.
cartTypeStringTipo do carrinho: 'suspended' (padrão) ou outros tipos do checkout.

​
Actions

ActionParâmetrosDescrição
redirectToCart—Redireciona o usuário para o checkout (inclui UTMs e tokens).
addProductsToCart{ skus, products, value, quantities?, extras?, showModal? }Adiciona um ou mais SKUs ao carrinho. Dispara evento de pixel após sucesso.
loadCart—Carrega o estado atual do carrinho da API. Em preview, usa dados de placeholder.
updateItemQuantity{ item, quantity, extras? }Atualiza a quantidade de um item no carrinho.
removeItem{ item, items?, totalPrice }Remove um item do carrinho. Dispara evento GA4 após sucesso.

​
Uso

// Em um componente Vue
this.$store.dispatch('cart/addProductsToCart', {
    skus: this.selectedSku,
    products: this.product,
    value: this.selectedSku.price,
    quantities: 1,
    showModal: true,
});

// Ler o carrinho
this.$store.getters['cart/cart'];

// Via mixin (acesso direto ao Vuex)
import { mapGetters, mapActions } from 'vuex';

export default {
    computed: {
        ...mapGetters('cart', ['cart']),
    },
    methods: {
        ...mapActions('cart', ['addProductsToCart', 'redirectToCart']),
    },
};