使用Nuxt、Google Tag Manager和Vuex

Question

我正在尝试将事件数据发送到Nuxt项目中的Google Tag Manger。这个包，https://www.npmjs.com/package/@nuxtjs/google-tag-manager，提供了我需要的东西。他们给出的例子假设我想从一个组件中调用函数：

this.$gtm.pushEvent({ event: 'myEvent', ...someAttributes })

但是，我实际上需要从一个Vuex模块调用该函数，在该模块中this是未定义的。我想我可以这样做：

import GTM from '@nuxtjs/google-tag-manager';

export default {
  actions: {
    myAction(_, data) {
      GTM.pushEvent(data);
    },
  ...

但这会导致：

TypeError: _nuxtjs_google_tag_manager__WEBPACK_IMPORTED_MODULE_3___default.a.pushEvent is not a function

我也试过了：

import Vue from 'vue';
const vm = new Vue();

export default {
  actions: {
    myAction(_, data) {
      vm.$gtm.pushEvent(data);
    },
  ...

但这会导致：

TypeError: Cannot read property 'pushEvent' of undefined

有趣的是，当我登录vm时，我将$gtm: undefined视为一个属性。所以很明显插件在那里，但它没有被激活？我知道我遗漏了一些基本的东西。

Answer 1

this.$gtm.push({ event: 'myEvent', ...someAttributes })

这是推送而不是pushEvent