title: How to get google analytics to show correct active page on SPA using gtag.js?
body: <p>I'm new to Google Analytics and so I've gone ahead and added the <code>gtag.js</code> code to my HTML page header and it works great for initial page load. However, I use React and react-router to dynamically change URL and Google Analytics is not picking up the change in active page or new hits when a URL change happens from my SPA.</p>
  
  <p>Answers I've found are for <code>ga.js</code> instead of <code>gtag.js</code>. I've tried to adapt <a href="https://developers.google.com/analytics/devguides/collection/gtagjs/single-page-applications" rel="nofollow noreferrer">Google's documentation suggestion here</a> with the URL listener in other answers to fit my need.. but although the code is running on dynamic page load, nothing is being sent to GA.</p>
  
  <pre><code>window.gtag &amp;&amp; history.listen((location)=&gt;{
      console.log('&gt;&gt;&gt;', location.pathname)
      gtag('config', 'GA_TRACKING_ID', {'page_path': location.pathname});
      // window.ga('set', 'page', location.pathname);  //--&gt; this would have worked with ga.js
      // window.ga('send', 'pageview', location.pathname);
  });
  </code></pre>