PressableContextWrapper
Wraps its children in a PressableContext.
Children can be a ReactNode or a Render Props function receiving TrackingContext.
PressableContextWrapper: (props: {
children: ReactNode | ((parameters: TrackingContext) => ReactNode),
id: string
}) => ReactElement
Parameters
type | ||
---|---|---|
required | children | ReactNode | ((parameters: TrackingContext) => void) |
required | id | string |
Returns
ReactElement
Usage example
Enrich Locations
import { PressableContextWrapper } from '@objectiv/tracker-react';
<PressableContextWrapper id={'do-it'}>
<button onClick={() => doIt()}>
Do it
</button>
</PressableContextWrapper>
Tracking via Render Props
import {
PressableContextWrapper,
trackFailureEvent,
trackPressEvent,
trackSuccessEvent
} from '@objectiv/tracker-react';
<PressableContextWrapper id={'do-it'}>
{(trackingContext) => (
<button onClick={async () => {
trackPressEvent(trackingContext);
const response = await doIt();
if (response.ok) {
trackSuccessEvent({
message: response.statusText,
...trackingContext
});
} else {
trackFailureEvent({
message: error.message,
...trackingContext
});
}
}}>
Do it
</button>
)}
</PressableContextWrapper>
info
The above is just an example to illustrate the Render Props functionality.
Check out our Tracked Elements for a ready-to-use TrackedButton component.
Did you know ?
PressableContextWrapper
internally uses LocationContextWrapper.