如何将gtag.js添加到react.js / next.js index.js?

时间:2018-06-27 21:11:42

标签: javascript next.js gtag.js

对于这个菜鸟问题,我感到抱歉,我只是开始使用next.js模板形式https://github.com/zeit/next.js/tree/canary/examples/hello-world/pages 通常我只将gtag.js添加到index.html中,但是对于此next.js,只有index.js。问题是我如何包括这个?我曾试图将gtag作为组件并尝试导入它,并且还包括该脚本,因为它位于index.js的render函数中,但到目前为止它不起作用!请帮助我!

Gtag:

java.time

index.js:

 <script async src="https://www.googletagmanager.com/gtag/js? 
   id=GA_TRACKING_ID"></script>
    <script>
  window.dataLayer = window.dataLayer || [];
  function gtag(){dataLayer.push(arguments);}
  gtag('js', new Date());

  gtag('config', 'GA_TRACKING_ID');
</script>

1 个答案:

答案 0 :(得分:2)

您可以像这样将gtag func添加为lib:

export const GA_TRACKING_ID = '<YOUR_GA_TRACKING_ID>'

// https://developers.google.com/analytics/devguides/collection/gtagjs/pages
export const pageview = url => {
  window.gtag('config', GA_TRACKING_ID, {
    page_location: url
  })
}

// https://developers.google.com/analytics/devguides/collection/gtagjs/events
export const event = ({ action, category, label, value }) => {
  window.gtag('event', action, {
    event_category: category,
    event_label: label,
    value: value
  })
}

有关如何在NextJS中添加Google Analytics(分析)的完整示例, 您可以看看here