Track event for the React Native SDK
Describes the useTrackEvent hook, which enables tracking events within functional components. This hook offers all the existing track event functionalities provided by the SDK.
Tracks a conversion event for a user. In other words, tracks an action a user takes. Logs an error message if the specified event key does not match any existing events. See How Optimizely Experimentation counts conversions.
Version
SDK 3.2 and higher. See Minimum version support.
Description
Use the useTrackEvent
hook to track events across multiple flag rules for a user. You should make only one track call per conversion (user action), even if many rules measure the conversion.
To use this hook, call useTrackEvent
within a component wrapped by OptimizelyProvider. See OptimizelyProvider for the React Native SDK.
Important
The attributes passed to
useTrackEvent
are only used for results segmentation on the Optimizely Experiment Results page.
Parameters
Beta
Event properties and the reserved tag key,
$opt_event_properties
, are currently in beta.
eventKey
(required) – String – The key of the event to be tracked. This key must match the event key provided when the event was created in the Optimizely app or REST API.eventTags
(optional) – Map – A map of key-value pairs specifying the reserved tag keys names and their corresponding values for this particular event occurrence.eventTags
are contextual metadata about conversion events. For example, revenue, load time, or total value. The following are available tag keys:revenue
– An integer value that is used to track the revenue metric for your experiments, aggregated across all conversion events.revenue
is recorded in cents.value
– A floating point value that is used to track a custom value for your experiments. Use this to pass the value for numeric metrics.$opt_event_properties
– A map of default and custom event properties and their values.
See reserved event tags.
Returns
This method sends conversion data to Optimizely Feature Experimentation. It does not provide return values.
Examples
Beta
Event properties are currently in beta. Contact your Customer Success Manager or sign up for the beta on Optimizely.com.
useTrackEvent hook
Enables tracking events within functional components. This hook offers the existing track event functionalities provided by the SDK.
// Assuming there is an OptimizelyProvider wrapping this component
import { useTrackEvent } from "@optimizely/react-sdk";
function SignupButton() {
const [track, clientReady, didTimeout] = useTrackEvent();
const handleClick = () => {
if (clientReady) {
// Define event properties
const properties = {
"category": "shoes",
"color": "red"
};
// Define tags including event properties
const tags = {
"revenue": 10000,
"value": 100.00,
"$opt_event_properties": properties
};
// Track event with tags
track("signup-clicked", tags);
}
};
return <button onClick={handleClick}>Signup</button>;
}
track
You can use the track
method of react client directly.
import { createInstance } from "@optimizely/react-sdk";
const client = createInstance({
sdkKey: SDK_KEY,
});
client.track("test_event", undefined, {
custom_attr: "value"
})
trackEvent
You can also use the trackEvent
method of a user context.
import { createInstance } from "@optimizely/react-sdk";
const client = createInstance({
sdkKey: SDK_KEY,
});
const userContext = client.getUserContext()
userContext.trackEvent("test_event")
Side effects
Additional Feature Experimentation functionality may be triggered by using this method.
Conversions
Calling this method records a conversion and attributes it to the variations that the user has seen. See How Optimizely Experimentation counts conversions.
You can create metrics on this conversion event and add metrics to experiments even after the conversion is tracked. See Events: Tracking clicks, pageviews, and other visitor actions.
Warning
This method does not track events if the event key is invalid.
Changing the traffic allocation of running experiments affects how conversions are recorded and variations are attributed to users. See Why you should not change a running experiment.
Notification listeners
Accessing this method triggers a call to the TRACK
notification listener.
Warning
This method does not call the
TRACK
notification listener if the event key is invalid.
Source files
The language and platform source files containing the implementation for React Native are available on GitHub.
Updated 4 days ago