Generates a <a> Element wrapped in a LinkContext.

TrackedAnchor: (props: {
objectiv?: {
id?: string,
href?: string,
normalizeId?: boolean
waitUntilTracked?: boolean,
}) => <a>

objectiv prop attributes

typedefault value
optionalidstringinferred from native id, title or children
optionalhrefstringinferred from native href
  • When the id attribute is omitted, we attempt to infer it from one of the elements' native props: id, title, children.
  • When the href attribute is omitted, we attempt to infer it from the anchor's href prop.

If either fails, an error will be logged to the Developer Console and the original Component is rendered.



Automatic Events

Usage example

import { TrackedAnchor } from '@objectiv/tracker-react';

<TrackedAnchor href={'/'}>Homepage</TrackedAnchor>

{/* Whenever inferring 'id' is not possible, we automatically look at `title` */}
<TrackedAnchor href={'/privacy'} title={'Privacy settings'}>
<img src="/lock.jpg"/>

{/* Or `id`, either one will do the job */}
<TrackedAnchor href={'/profile'} id={'Profile settings'}>
<img src="/profile.jpg"/>

By default, all Tracked Elements automatically normalize their Context identifiers to a kebab-cased format.

This can be disabled via the normalizeId option:

import { TrackedAnchor } from '@objectiv/tracker-react';

<TrackedAnchor href={'/'} objectiv={{ normalizeId: false }}>Back to home</TrackedAnchor>

<TrackedAnchor href={'/privacy'} title={'Privacy settings'} objectiv={{ normalizeId: false }}>
<img src="/lock.jpg"/>

<TrackedAnchor href={'/profile'} id={'Profile settings'} objectiv={{ normalizeId: false }}>
<img src="/profile.jpg"/>

Did you know ?

TrackedAnchor internally uses TrackedLinkContext.