React Native: GoogleTagManager
- 1.Sign up for Google Tag Manager and create a mobile container. Select Legacy for SDK Version, and be sure to make a note of your property's tracking Id.
- 2.
- 3.For each mobile platform (Android or iOS), you need to follow its corresponding manual installation for GoogleAnalyticsBridge usage.
- 4.Install the target:npm install --save @redux-beacon/react-native-google-tag-manager
import { Platform } from 'react-native';
import { GoogleTagManager as GTMBridge } from 'react-native-google-analytics-bridge';
import GoogleTagManager from '@redux-beacon/react-native-google-tag-manager';
// Create or import an events map.
// See "getting started" pages for instructions.
const containerId = (Platform.OS === 'ios') ? 'GTM-IOSXXXX' : 'GTM-ANDROID';
const gtm = GoogleTagManager(containerId, GTMBridge);
const gtmMiddleware = createMiddleware(eventsMap, gtm);
const event = (action, prevState, nextState) => {
return {
event: /* fill me in */,
/* add any additional key/value pairs below */,
};
};
- If an event object doesn't have an
event
property, but has ahitType
property, this target will create anevent
property and set it to thehitType
string. For example:// Given the following event definitionconst pageview = action => ({hitType: 'pageview',page: action.payload,});// Say the action is equal to// { type: LOCATION_CHANGE, payload: '/home' }// The following object will get pushed to the dataLayerconst dataLayerEvent = {hitType: 'pageview',event: 'pageview', // this is done automaticallypage: '/home',};
Last modified 5yr ago