useOptimizelyClient for the React SDK v4+

3 min

Minimum SDK version

v4.0.0+

For versions 3.x and earlier, the equivalent functionality was provided by the withOptimizely higher-order component. See React SDK prior to v4React SDK prior to v4.

Description

The useOptimizelyClient hook returns the Optimizely Client instance from context. Use this hook when you need direct access to the client for operations not covered by the decide hooks.

To use this hook, call useOptimizelyClient within a component wrapped by OptimizelyProvider. See OptimizelyProvider for the React SDKOptimizelyProvider for the React SDK.

Returns

Returns the Optimizely Client instance provided to <OptimizelyProvider> via the client prop.

Example

import { useOptimizelyClient } from '@optimizely/react-sdk';

function MyComponent() {
  const client = useOptimizelyClient();

  const handleClick = () => {
    if (client) {
      const user = client.createUserContext('user-123', { plan: 'gold' });
      const decision = user.decide('flag-key');
      console.log('Decision:', decision);
    }
  };

  return <button onClick={handleClick}>Check Flag</button>;
}

Source files

The language and platform source files containing the implementation for the React SDK are available on GitHub.