我看了一下这个包,在https://github.com/nuxt-community/gtm-module/blob/master/lib/defaults.js
里有下面这段代码:
function startPageTracking(ctx) {
ctx.app.router.afterEach((to) => {
setTimeout(() => {
ctx.$gtm.push(to.gtm || {
routeName: to.name,
pageType: 'PageView',
pageUrl: '<%= options.routerBase %>' + to.fullPath,
pageTitle: (typeof document !== 'undefined' && document.title) || '',
event: '<%= options.pageViewEventName %>'
})
}, 250)
})
}
从那里看,数据层看起来像这样:
{
routeName: to.name,
pageType: 'PageView',
pageUrl: '<%= options.routerBase %>' + to.fullPath,
pageTitle: (typeof document !== 'undefined' && document.title) || '',
event: '<%= options.pageViewEventName %>' //default is 'nuxtRoute'
}
事件的默认名称是“nuxtRoute”。因此,在GTM中,您将定义一个自定义事件触发器来触发“nuxtRoute”事件。操作如下:
然后,您需要在GTM中创建两个DataLayer变量,以捕获pageUrl
(请注意驼峰式拼写),并可能捕获routeName
。我说routeName
是可选的,这取决于您是否更改/更新了文档的<title>
标签。
然后,在GTM中创建您的Google Analytics标签。确保它是“pageview”类型,然后勾选“在此标签中启用覆盖设置”复选框,在“更多设置>要设置的字段”下,输入“page”作为字段名,对于“value”,引用我们创建的变量。如果您想使用to.name变量设置页面标题,请使用“title”字段。确保还在“触发”下添加nuxt路由触发器。
保存并发布所有内容,或在预览模式下运行它,您应该可以看到页面浏览量的统计。