Provider

The <EvolvProvider /> is a top-level component that is responsible for instantiating the Evolv Client. The Evolv Client, in turn, is responsible for retrieving the configuration and variables for your projects and reporting data back to Evolv, such as confirmations.

info

Any components that will make use of the Evolv platform must be wrapped by <EvolvProvider />.

Configure client options

The <EvolvProvider /> component is responsible for instantiating an instance of the Evolv client, which is in turn will retrieve the configuration and variables for your projects. The only required option is environment.

tip

The environment ID can be obtained from the Environments page in Manager.

src/index.tsx

import { EvolvClientOptions } from '@evolv/react';

const options: EvolvClientOptions = {
	environment: '[environmentId]'
};

See also:

• List of options

Add <EvolvProvider /> to your application or page

info

For usage in NextJS applications, see here.

Props

Name	Type	Required	Description
options	object	true	Options passed to EvolvClient. See list of options
uid	string	true	Unique identifier of the current user. See User IDs
hydratedState	object	false	Value to hydrate as the user's allocation variant. This is primarily used for server-side applications
remoteContext	object	false	Additional values added to the context
localContext	object	false	Additional values added to the context that will not be transmitted to Evolv

src/index.tsx

import { EvolvProvider } from '@evolv/react';
import React, { FC } from 'react';

const App: FC = () => {
	return (
		<EvolvProvider
			options={options}
			uid={uid}
			remoteContext={remoteContext}
		>
			<h1>My React app</h1>
		</EvolvProvider>
	);
}

export default App;

See also:

• API Documentation