how do you format a number to currency when using React native EXPO?

react-native expo
Choco picture Choco · Apr 7, 2019 · Viewed 45.4k times · Source

how do I take a number like 10000 and have it output as $10,000.00?

I even had a problem with String.format(...) with a Not a function error.

I followed numerous articles, all incomplete and none working.

I don't need full internationalization, just the ability to format a number

Answer

Masuk Helal Anik picture Masuk Helal Anik · Apr 7, 2019

You can use this library react-number-format. It has these features

  1. Prefix, suffix and thousand separator.
  2. Custom format pattern.
  3. Masking.
  4. Custom formatting handler.
  5. Format number in an input or format as a simple text

Sample usage 

<NumberFormat value={2456981} displayType={'text'} thousandSeparator={true} prefix={'$'} />

Output : $2,456,981

Related questions

Hide header in stack navigator React navigation

I'm trying to switch screen using both stack and tab navigator. const MainNavigation = StackNavigator({ otp: { screen: OTPlogin }, otpverify: { screen: OTPverification}, userVerified: { screen: TabNavigator({ List: { screen: List }, Settings: { screen: Settings } }), }, }); In this case stacknavigator is used first and then tabnavigator. and …

Read More
What is the difference between Expo and React Native?

From the Expo website Expo lets web developers build truly native apps that work across both iOS and Android by writing them once in just JavaScript. Isn't this what React Native does? What's the difference?

Read More
Cannot add task 'wrapper' as a task with that name already exists

When installing 'react-native init AwesomeProject' I get this error when I run react-native run-android: Could not determine java version from '11.0.1'. A quick google suggests I need to update the distributionUrl in the Gradle-wrapper. Having done this I am …

Read More