alinemorelli / react-gtm

React Google Tag Manager
MIT License
658 stars 140 forks source link

DataLayer isn't being updated in internal navigation #72

Open mttetc opened 3 years ago

mttetc commented 3 years ago

Hello, I can't get this lib to work really good. I'm using react helmet by the way. Only thing that I can do is generating a random string for dataLayerName and it'll create another dataLayer, which is not what I want. I want the current dataLayer to be updated with new pages inside, like the result you get from window.dataLayer.push.

I'm not sure what I'm doing wrong, here is my code : App.js

        const tagManagerArgs = {
        gtmId: 'GTM-MPF7T3P'
    }

    useEffect(() => {
        loaded && TagManager.initialize(tagManagerArgs);
    }, [loaded]);

Metatags.js

const Metatags = ({pageTitle} ) => {
    const pageChanged = () => {
        TagManager.dataLayer({
            dataLayerName: 'pageDataLayer',
            dataLayer: {
                title: pageTitle
            }
        })
    }

    return (
        <Helmet
            onChangeClientState={() => pageChanged()}>
            TAGS HERE
        </Helmet>
    )
}

Data layer is changed if I navigate through but not through Anyone stumbled upon this ?

mttetc commented 3 years ago

I went with vanilla js, will use this again if it's fixed

qnxdev commented 3 years ago

It was the adblocker for me causing the issue

I used

TagManager.dataLayer({dataLayer:{
        event: {}
}
}