I have this code as below in a custom module
define([
'rjsResolver',
'Magento_Customer/js/customer-data',
'jquery'
], function (resolver, customerData, $) {
'use strict';
return function (checkoutLoader) {
var mixin = {
gtmEventTrigger: function() {
console.log("Init Checkout Loader");
console.log(customerData);
// console.log(customerData.get('cart'));
// console.log(customerData.get('cart')());
$(cart_items).each(function(index,productData){
product_detail = {};
product_name = productData['product_name'];
product_detail = {
'item_name':product_name,
}
products.push(product_detail);
})
dataLayer.push({
'event': 'begin_checkout',
'ecommerce': {
'currency': 'MYR',
'value': grand_total,
'items': products
}
});
}
};
mixin.gtmEventTrigger();
return $.extend(checkoutLoader, mixin);
};
});
I would like to know what is causing the customer cart data unable to be retrieved through the code console.log(customerData.get('cart'));
, when I console.log I receive undefined value
Appreciate if someone can advise what is the correct way to write the codes to retrieve this customer cart data through a .js file
The location of the file is as follows
app/code/SR/ModifiedCheckout/view/frontend/web/js/checkout-loader.js
in which the checkout-loader.js is loaded like this
var config = {
config: {
mixins: {
'Magento_Checkout/js/checkout-loader': {
'SR_ModifiedCheckout/js/checkout-loader': true
}
}
}
};
in the file path app/code/SR/ModifiedCheckout/view/frontend/requirejs-config.js