跟踪 ReactJS 应用程序

Question

我一直在使用 AngularJS，它的结构是这样的，当用户浏览网站时，只有视图和路线会发生变化，并且没有 pageviews 等被触发（GTM 不是每个路由加载）。

因此，在使用 AngularJS 网站。

现在我正在阅读 ReactJS，我非常热衷于将它与 Laravel 一起使用。我只担心 React 的整个 virtual DOM 概念 之后确实会造成类似的跟踪痛苦，因为这意味着Google 可能不会在用户每次登陆页面时加载跟踪代码管理器容器。

有人遇到跟踪 React 应用程序的问题吗？

Answer 1

您将 React 挂载到给定的 DOM 元素，然后该元素成为挂载根元素。只有这些元素会被改变，这意味着如果你有脚本标签等，而不是在反应中，这些不会受到影响

<html>
  <head>
    <script src="/gtm.js"></script>
    <script src="/react.js"></script>
  </head>
  <body>
    <div id="mount">
    </div>
    <script>
      class Test extends React.Component {
        track() {
          window.dataLayer.push({
            event: 'Stuff'
          });
        }

        render() {
          return <button onClick={this.track} />;
        }
      }
      React.render(<Test />, document.getElementById('mount'))
    </script>
</html>

因为 React 只能修改 #mount 内的内容，因此 gtm 标签应该始终存在。

跟踪 ReactJS 应用程序

Tracking a ReactJS application

javascript

angularjs

reactjs

google-analytics

virtual-dom