Currency internationalization | eo-locale
source link: https://eo-locale.netlify.app/blog/money/
Go to the source link to view the article. You can view the picture content, updated content and better typesetting reading experience. If the link is broken, please click the button below to view the snapshot at that time.
Currency internationalization
Maksim Sharipov
Maintainer of eo-localeIn this article we consider how to create clear and reusable component Money.
For many websites it is actual issue to display prices in different currencies and for different languages.
It helps to be more friendly with customers from any country.
Let's figure requirements for those component:
- Ability to pass currency
- Ability to pass language, because for different languages we use different numeric format
- Mode of currency display
Actually, with @eo-locale/react it is quite simple issue.
I am a big fan of TypeScript and all examples will use it.
Interface MoneyProps extends interface Intl.NumberFormatOptions, therefore
we can use any of standard params from Intl.NumberFormat.
For example, with next props:
Component will display $1,000.00
For change mode of currency display, set currencyDisplay property.
It can be symbol, code or name. By default symbol.
Component will display 1,000.00 US dollars
If you want to show only one fraction digit, just pass maximumFractionDigits and minimumFractionDigits property.
Component will display $1,000.0
Recommend
About Joyk
Aggregate valuable and interesting links.
Joyk means Joy of geeK