GTM trigger as user scrolls down on page in ReactJS

[simran-k]

I am using https://www.npmjs.com/package/react-google-tag-manager for managing GTM tags in ReactJS.

I have GoogleTagManager Component as suggested. I call this GoogleTagManager component everytime user scrolls down on the Product listing page. As user scrolls down, although the GoogleTagManager is getting rendered but GTM preview reports that GTM is triggered only once on page load. (Although I can clearly see my console statement from GTM component getting rendered as user scrolls down so indeed it is getting called)

Here's how I call it:

{this.state.callGTM===true && <GoogleTagManager gtmId='GTM-A12B12' additionalEvents={this.state.gaDataEvent}/>}

Here's what I see inside of script tag:

```

(function(w,d,s,l,i){w[l]=w[l]||[]; w[l].push({'gtm.start': new Date().getTime(),event:'gtm.js', "event":"productListingImpressions","ecommerce":{"currencyCode":"INR","impressions":[{"name":"Blue Top","id":21443,"sku":"IN1747567OTOPBLU-714","price":1199,"category":"Category Results","list":""}}]}}); var f=d.getElementsByTagName(s)[0],j=d.createElement(s),dl=l!='dataLayer'?'&l='+l:''; j.async=true;j.src='//www.googletagmanager.com/gtm.js?id='+i+dl ; f.parentNode.insertBefore(j,f); })(window,document,'script','dataLayer','GTM-A12B12');

What I need to do is pass `this.state.gaDataEvent` as datalayer to GTM. But as I am using GTM preview, I see that it is not getting triggered again as the user scrolls down.