FormattedNumber component from react-intl doesn't work

Question

I am trying to use the component FormattedNumber from the react-intl library but I can't make it to work.

<IntlProvider
    locale="en-US"
    messages={locales['en-US']}
>
    <div>
        <FormattedNumber value={123456} />
        <FormattedNumber value="123456" />
    </div>
</IntlProvider>

This only returns the value the way I passed it to the component, wrapped with a span, but it doesn't format the number.

I get an error in the console:

[React Intl] Error formatting number. TypeError: Bind must be called on a function

The FormattedMessage component works fine for all my translations, the locale is set to en-US , so I don't think the issue comes from the IntlProvider or something else.

I am using the latest version of the library, 2.0.1

Any idea?

Answer 1

I have the same issue. In my case problem was in global definition window.Intl. It rewrite the original lib object and lose functions context