是否可以使用@nuxtjs/google-analytics 实施Google 增强型电子商务？

Question

我有一个已在 Nuxt.js 上实现的网络应用程序。我已将 Google Analytics 连接到它，但我不需要任何东西。

所以，我已经阅读了有关 Google 增强型电子商务的信息，并想将其连接到我的应用程序。

Here，我找到了我真正想做的事情，但我不知道如何在 Nuxt.js.

上做

例如：

ga('ec:addProduct', {               // Provide product details in an productFieldObject.
  'id': 'P12345',                   // Product ID (string).
  'name': 'Android Warhol T-Shirt', // Product name (string).
  'category': 'Apparel',            // Product category (string).
  'brand': 'Google',                // Product brand (string).
  'variant': 'black',               // Product variant (string).
  'price': '29.20',                 // Product price (number).
  'quantity': 1                     // Product quantity (number).
});

如你所见，这只是纯 JS，绝对不是我需要的。正如我所说，@nuxtjs/google-analytics 没有这样的功能。我只有页面、事件、屏幕和时间跟踪器，但这不是我要找的。

所以，我会这样问：如何使用 Nuxt.js 实现上面的代码（增强型电子商务）？

如果有人已经这样做并将增强型电子商务集成到 Nuxt.js 应用程序中，您是如何做到的？或者仍然可以用 @nuxtjs/google-analytics 做这样的事情吗？

感谢解答！

Answer 1

所以 @nuxtjs/google-analytics is using vue-analytics，支持电子商务。在切换到常规 GTM 之前，我们使用了它很长一段时间（主要是因为当时 vue-gtag 太新了）。

回购协议中的一条注释：

⚠️ Sorry but vue-analytics is not longer maintained. I would suggest you to switch to vue-gtag. With love, the guy who made the package.

无论如何，vue-analytics 提供了一个如何使用电子商务的示例here。

首先，您需要在您的 nuxt 配置中启用它：

export default {
  googleAnalytics: {
    id: 'UA-XXX-X',
    ecommerce: {
      enabled: true,
      enhanced: true // enables enhanced ecommerce
    }
  }
}

然后，你可以在你的组件或 Vuex 模块中这样调用它：

this.$ga.ecommerce.addItem({
  id: '1234',                     // Transaction ID. Required.
  name: 'Fluffy Pink Bunnies',    // Product name. Required.
  sku: 'DD23444',                 // SKU/code.
  category: 'Party Toys',         // Category or variation.
  price: '11.99',                 // Unit price.
  quantity: '1'                   // Quantity.
})

请参阅 here 以获取可在 $ga 上使用的方法名称的完整列表。

是否可以使用@nuxtjs/google-analytics 实施Google 增强型电子商务？

Is it possible to implement Google Enhanced Ecommerce using @nuxtjs/google-analytics?

google-analytics

enhanced-ecommerce

nuxt.js