如何在react js应用程序中使用react-gtm-module?

Yuv*_*ari 9 javascript google-analytics google-tag-manager reactjs

在我的反应应用程序中,我使用了react-gtm-module. 我只有 GTM ID。

我将以下代码放入每个页面路由器组件中

import TagManager from 'react-gtm-module';

componentDidMount(){
        const tagManagerArgs = {
            dataLayer: {
                page: '/pagepath'
            },
            gtmId: 'GTM-XXXXXX',
            
        }
        TagManager.initialize(tagManagerArgs)
       
    }
Run Code Online (Sandbox Code Playgroud)

我只是将上面的代码放在每个路由组件中。通过使用上面的代码,在谷歌分析中,路径有时显示,有时不显示Active Page

这只是我必须放入代码中才能实现谷歌分析跟踪页面的代码还是我必须添加更多其他代码?如果是,那么我到底需要添加什么以及在哪里添加?

当然,我在代码中遗漏了一些东西。但到底是什么?

小智 13

仅使用每个应用程序中的 id 进行初始化,而不是每个页面

TagManager.initialize({
  gtmId: gtm_id,
});
Run Code Online (Sandbox Code Playgroud)

然后在每个页面中,

TagManager.dataLayer({
  dataLayer: {
    event: 'pageview',
    pagePath: 'page-path-here',
    pageTitle: 'page-title-here',
  },
});
Run Code Online (Sandbox Code Playgroud)