Configuration
- Google Tag Manager, single container
- GA4, web data stream
- GA is connected to GTM with GA4 through GA4 Configuration Tag
- GTM initialisation has been copy/pasted under and as per instructions in GTM
- Created add_to_cart tag
- Created dataLayer, trigger in various ways
My code is this in .vue file
addToCart() {
var payload = {
'id': this.id,
'odoo':this.odoo,
'wine': this.wine,
'url': this.url,
'vintage': this.vintage,
'volume': this.volume,
'price': this.price,
'quantity': this.quantity,
'totalQuantity': this.quantity,
'available': this.available,
'labelurl': this.labelurl,
'estate': this.estate,
};
this.$store.dispatch( 'updateCartline', payload );
window.dataLayer = window.dataLayer || [];
window.dataLayer.push({
event: "add_to_cart",
currency: "EUR",
value: payload.quantity * payload.price,
items: [
{
item_id: payload.id,
item_name: payload.wine + " " + payload.vintage + " " + payload.volume,
price: payload.price,
quantity: payload.quantity
}
]
}
)
},
When checking network in developer mode it appears that every time addToCart is invoked, 20 dataLayer.push are fired! On GA-4, the event add_to_cart reports 20 event calls.
What happens? How can I obtain a correct behaviour (single firing)
