Options
All
  • Public
  • Public/Protected
  • All
Menu

Class LDProvider

The LDProvider is a component which accepts a config object which is used to initialize launchdarkly-js-client-sdk.

This Provider does three things:

  • It initializes the ldClient instance by calling launchdarkly-js-client-sdk initialize on componentDidMount
  • It saves all flags and the ldClient instance in the context API
  • It subscribes to flag changes and propagate them through the context API

Because the launchdarkly-js-client-sdk in only initialized on componentDidMount, your flags and the ldClient are only available after your app has mounted. This can result in a flicker due to flag changes at startup time.

This component can be used as a standalone provider. However, be mindful to only include the component once within your application. This provider is used inside the withLDProviderHOC and can be used instead to initialize the launchdarkly-js-client-sdk. For async initialization, check out the asyncWithLDProvider function

Hierarchy

Implements

  • EnhancedComponent

Index

Constructors

Properties

Methods

Constructors

constructor

  • Parameters

    Returns LDProvider

Properties

Readonly state

state: Readonly<LDHocState>

Methods

componentDidMount

  • componentDidMount(): Promise<void>

  • Returns Promise<void>

componentDidUpdate

  • Parameters

    Returns Promise<void>

getReactOptions

  • getReactOptions(): { sendEventsOnFlagRead: boolean; useCamelCaseFlagKeys: boolean }

  • Returns { sendEventsOnFlagRead: boolean; useCamelCaseFlagKeys: boolean }

    • sendEventsOnFlagRead: boolean

      Whether to send flag evaluation events when a flag is read from the flags object returned by the useFlags hook. This is true by default, meaning flag evaluation events will be sent by default.

    • useCamelCaseFlagKeys: boolean

      Whether the React SDK should transform flag keys into camel-cased format. Using camel-cased flag keys allow for easier use as prop values, however, these keys won't directly match the flag keys as known to LaunchDarkly. Consequently, flag key collisions may be possible and the Code References feature will not function properly.

      This is true by default, meaning that keys will automatically be converted to camel-case.

      For more information, see the React SDK Reference Guide on flag keys.

      see

      https://docs.launchdarkly.com/sdk/client-side/react/react-web#flag-keys

initLDClient

  • initLDClient(): Promise<void>

  • Returns Promise<void>

render

  • render(): Element

  • Returns Element

subscribeToChanges

  • subscribeToChanges(ldClient: LDClient): void

  • Parameters

    • ldClient: LDClient

    Returns void

Generated using TypeDoc