MessageProvider() function

<MessageProvider messages [locale] [merge] [onError] [pathSep]>

Makes the messages available for its descendants via a React Context. To support multiple locales and/or namespaces, MessageProviders may be used within each other, merging each provider’s messages with those of its parents. The locale preference order is also set similarly, from nearest to furthest.

Signature:

export declare function MessageProvider(props: MessageProviderProps): FunctionComponentElement<ProviderProps<MessageContext>>;

Parameters

Parameter	Type	Description
props	MessageProviderProps

Returns:

FunctionComponentElement<ProviderProps<MessageContext>>

Example

import React from 'react'
import { Message, MessageProvider } from '@messageformat/react'

const messages = { example: { key: 'Your message here' } }
const extended = { other: { key: 'Another message' } }

const Example = () => (
  <span>
    <Message id={['example', 'key']} />
    {' | '}
    <Message id="other/key" />
  </span>
) // 'Your message here | Another message'

export const App = () => (
  <MessageProvider messages={messages} pathSep="/">
    <MessageProvider messages={extended}>
      <Example />
    </MessageProvider>
  </MessageProvider>
)